크롬 플러그 인 개발 (크롬 사이트 쿠키 가 져 오기)

크롬 플러그 인 개발
생각 보다 쉽 네요.
프로젝트 기본 디 렉 터 리

//    demo  

├── icon.png
├── manifest.json
├── popup.html
└── popup.js

핸드 디 버 깅chrome://extensions/ 을 열 어 개발 자 모드 를 엽 니 다.
선택 자신의 항목 파일 을 선택 하면 디 버 깅 을 시작 할 수 있 습 니 다.
항목 아래 파일 분석
manifest. json 프로필

{
 //   
 "manifest_version": 2,
  "name": "      ",
  "version": "     ",
  
  //   ：           、    、       。
   "browser_action": { 
    "default_title": "get cookie In chrome", //        icon tips
    "default_popup": "popup.html", //     popup     
    "default_icon": "icon.png", //    icon
    
    // page_action                  ，      
    
    
    "background": { //       /    
        "scripts": ["eventPage.js"], //   ，
         "page": "background.html", //     html
        "persistent": false //       
      },
      
     "permissions": [ //     ，   js          
          "tabs", //     chrome tab   
          "bookmarks", //          
          
          "http://www.blogger.com/", //       
          "http://*.google.com/", 
          "unlimitedStorage" //      
          ...//         
        ],
    ....
  },
 }
 
 

위 에서 언급 한 부분의 상세 한 설명 문서:
permissions 권한 목록
커 뮤 니 케 이 션
1. chrome.runtime.sendMessage 적합

content.js => background.js   
content.js => popup.js   
background.js => popup.js   

2. chrome.tabs.sendMessage 적합

background.js => content.js

popup.js => content.js

3. 정보 수신 용 chrome.runtime.onMessage.addListener4. popup 페이지 는 chrome.extension.getBackgroundPage() 방식 으로 background 의 함 수 를 호출 할 수 있다.
작은 구덩이 들
1. 도입 vue 시 안전성 문제 가 발생 할 수 있 으 므 로 manifest.json 에 설치 해 야 한다.

"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"

2. background 에서 사용 jquery 해 야 한다 면 jquery 을 background.js 이전에 도입 해 야 한다. 예 를 들 어:

"background": {
    "scripts": [jquery-3.4.1.min.js", "background.js"],
    "persistent": true
  },
  

3. 모든 운영 환경 은 자신의 devTools 이 있 습 니 다. 예 를 들 어 popup 인터페이스 에서 개발 자 도 구 를 꺼 내 려 면 플러그 인 icon 에 대한 오른쪽 단 추 를 클릭 하고 을 클릭 해 야 합 니 다. background 에서 플러그 인 을 찾 아야 합 니 다. chrome://extensions/ 설정 이 성공 하면 background.js 링크 가 있 습 니 다. 클릭 하면 개발 자 도구 가 나 옵 니 다.
4. 공식 적 으로 정시 임 무 를 쓰 려 면 background 사용 해 야 한다 고 했 지만 실제로 alarm 와 settimeout 도 가능 하 다 (또한 setintervel 백 스테이지 프로그램 을 죽 이 는 것 을 방지 하려 면 chrome 중의 manifest.json 설정 이 필요 하 다)
5. background 프로그램 에서 ajax 요청 을 보 낼 수 있 지만 api 가 있 는 서버 에서 크로스 도 메 인 설정 을 지원 해 야 합 니 다.
6. persistent = true 중의 html 는 집행 되 지 않 는 다.
나의 작은 응용 프로그램 (chrome 에서 지정 한 사이트 의 쿠키 가 져 오기)
https://github.com/spademan/g...
작은 별 을 줬 으 면 좋 겠 어 요.
참고 문서