배경

또 다른 Chrome 확장을 만들었습니다. 이것은 무엇을 할 수 있다고 하면, Github의 웹 페이지에서 소스를 열람할 때, 공백(Space, Tab, Enter)등을 특별한 부호로 표시해 줍니다. 이런 느낌입니다.



또, 교환 부호도 커스터마이즈 할 수 있도록, Options 화면을 추가해 localStorage에 보존하는 것으로 구현했습니다.

// manifest.js
  "options_page": "options.html",

설정 화면은 이런 느낌

문제 발생

하지만 실제로 작동하면 content_scripts에서 해당 설정을 읽을 수 없습니다.

~~~~ 살펴보면 content_scripts가 Tab 페이지의 컨텍스트 내에서 움직이기 때문에 Extention과는 별도의 컨텍스트입니다.

Google의 Doc ( htps : //로 ゔぇぺぺr. ch 로메. 코 m / 에 x 텐시 온 s / 메사 긴 g # 시 mp ぇ )에 따라 메시지로 데이터를 전달할 수 있습니다.

구현도 간단,

1. background.js 추가 (항상 움직이는 페이지 필요)

// manifest.js
  "background": {
    "scripts": ["background.js"]
  },

메시지 수신 준비

  chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) {
      if (request.action == "get_conf"){
        var conf = getConf();
        sendResponse(conf);
      }
    });

2. content_script에서 메시지 보내기

  chrome.runtime.sendMessage({action: "get_conf"}, function(response) {
   // response はbackground.jsからのデータが格納されています。
  });

모든 소스는 여기 htps : // 기주 b. 코 m / ubin 0329 / giteu b-so rse- ぃ e w-p ㅅ