크롬 익스텐션 예제

현재 활성 페이지에 특정 스크립트가 있는지 확인하는 Chrome 확장 프로그램을 만들 예정입니다. 하지만 먼저 기본 유효한 확장 이 있다는 것을 온전성 검사로 “Hello World” 경고를 표시하는 확장을 로컬로 배포해 보겠습니다. 따라서 크롬 확장 프로그램을 구축하는 데 필수적인 파일입니다: 페이지의 왼쪽 상단에 작은 색사각형을 출력하는 Chrome 확장 프로그램을 만들어 어떤 유형의 도메인(예: .dev, .stage)에 있는지 알릴 수 있습니다. 이러한 도메인및 색상은 옵션 페이지에서 관리됩니다. 확장이란 무엇입니까? 그들은 수정 하 고 크롬 브라우저의 기능을 향상 시킬 수 있는 작은 소프트웨어 프로그램. 크롬 확장 은 크롬의 기능을 확장. HTML, CSS 및 자바 스크립트를 사용하여 작성합니다. 팝업 UI의 마지막 단계는 단추에 색상을 추가하는 것입니다. 다음 코드를 사용하여 popup.js라는 파일을 만들고 추가하거나 여기에 다운로드합니다. 콘텐츠 스크립트에는 몇 가지 제한 사항이 있습니다. 확장, i18n, 런타임 및 저장소를 제외한 chrome.* API는 사용할 수 없습니다.

콘텐츠 스크립트는 현재 페이지에 액세스할 수 있지만 액세스할 수 있는 API에서는 제한됩니다. 예를 들어 브라우저 동작의 클릭을 수신 할 수 없습니다. 모든 Chrome API에 액세스할 수 있지만 현재 페이지에 액세스할 수 없는 다른 유형의 스크립트를 확장 프로그램인 백그라운드 스크립트에 추가해야 합니다. 구글이 말했듯이 : 이것은 확장이 설치될 때 코드를 실행할 수 있게 해주어 줄 것입니다. 이 이벤트를 사용하여 옵션 페이지에 대한 기본 항목을 추가합니다. 축하합니다, 당신은 지금 당신의 확장을 게시했습니다! ? 나는이 튜토리얼은 적어도 당신이 크롬 확장에 관심이 있어 바랍니다. 우리는 단지 표면을 긁었다. 어떤 목적으로든 리포지토리의 코드를 자유롭게 사용할 수 있습니다. 확장은 현재 사용자가 배경을 녹색으로 변경할 수 있도록 허용합니다.

옵션 페이지를 포함하면 사용자가 확장 기능보다 더 많은 제어를 할 수 있으며, 브라우징 환경을 더욱 맞춤화할 수 있습니다. 확장 프로그램이 작동하는 것을 보려면 확장 확장 관리 페이지에서 모든 파일을 저장하고 “다시 로드”를 클릭합니다. 도구 모음에 아이콘이 표시됩니다. 옵션 페이지를 보려면 내선 번호 아래에서 `세부정보`를 클릭하고 아래로 스크롤하여 `내선 옵션`이라고 적혀 있습니다. 먼저 브라우저에서 chrome://extensions 이동하거나 Chrome 메뉴에서 “추가 도구” 및 “확장 프로그램”을 클릭합니다. 이렇게 하면 개발자 모드를 켤 수 있는 확장 관리 페이지(오른쪽 상단에 있어야 합니다)로 이동합니다. 저장소 API를 포함한 대부분의 API는 확장에서 사용할 수 있도록 매니페스트의 “사용 권한” 필드에 등록해야 합니다. 콘텐츠 스크립트는 웹 페이지의 컨텍스트에서 실행되는 파일입니다. 표준 문서 개체 모델(DOM)을 사용하면 브라우저가 방문하는 웹 페이지의 세부 정보를 읽고, 변경하고, 상위 확장에 정보를 전달할 수 있습니다.

Tento obsah bol zaradený v Nezaradené. Zálohujte si trvalý odkaz.