chrome storage onChangedリスナーが起動しない

Question

私は、検索結果から説明テキストを取得してChromeの保存場所に保存するChrome拡張機能を作成しています。私はchrome.storage.local.setを使用して、クロムストレージ内の値をbackground-jsに変更します。その後、content.jsにアクセスします。 onChanged.addListener()を削除すると拡張機能が動作しますが、値がクロームストレージ内で変更された場合にのみ機能します。

content.js

chrome.runtime.onMessage.addListener(function(request,sender,sendResponse){ 
    if (request.message=="browserAction"){ 
     var link = $('h3.r') 
     link.click(function(){ 
      var d = this.nextSibling 
      var description = $(d).find('span.st').text() 
      var index = description.lastIndexOf("-") 
      if (index>=0){ 
       var description = description.slice(index+2,description.length-1) 
      } 
      alert(description) 
      chrome.runtime.sendMessage({"message":"linkClicked","description":description}) 
     })  
    } 
}) 
chrome.storage.onChanged.addListener(function(changes,areaName){ 
chrome.storage.local.get("keyName",function(items) {//initialize the application 
      console.log(items.keyName) 
      var p = document.getElementsByTagName('p') 
      for (n=0;n<p.length;n++){ 
       console.log(p[n].textContent) 
       if (p[n].textContent.includes(items.keyName)){ 
        console.log('found a match at paragraph' + p[n]) 
        var newStr = p[n].textContent.replace(items.keyName,"<span style='background-color:yellow'>" + items.keyName + "</span>") 
        p[n].innerHTML=newStr 
        $('html, body').animate({ 
        scrollTop: $('p:eq('+n+')').offset().top + 'px' 
        }, 'fast')   
        return 
       } 
       else{console.log('no match found')} 
      } 

}) 
}) 

背景-jsから

chrome.browserAction.onClicked.addListener(function(tab){ 
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs) { 
     var activeTab = tabs[0]; 
     chrome.tabs.sendMessage(activeTab.id,{"message":"browserAction"}) 
     }); 
}) 
chrome.runtime.onMessage.addListener(function(request,sender,sendResponse){ //Listener Not Firing 
    if (request.message=="linkClicked"){ 
     var d = request.description 
     console.log(d) 
     if (d.indexOf('.')>=0){ //this will always evaluate to true and execute, leaving empty string |||| 
      var d = d.slice(0,d.indexOf('.')) //get a snippet of text 
     } 
    } 
    console.log(d) 
    chrome.storage.local.set({"keyName": d},function(){console.log('mah critics stored')}); 
}) 

manifest.jsonを

{ 
    "manifest_version":2, 
    "name":"extension", 
    "version":"0.1", 
    "content_scripts":[ 
     { 
      "matches": ["<all_urls>"], 
      "js":["content.js","jquery-3.1.1.min.js"] 
     }], 
    "browser_action":{ 
       "default_icon":"icon.png" 
      } 
     , 
    "background":{ 
     "scripts":["background.js"] 
    }, 
    "permissions":[ 
     "storage", 
     "tabs" 
    ] 

} 

Answer 1

はonChangedイベントリスナーが発射WAS判明します。新しいページが開きすぎて、リンクのあるページのコンソールにメッセージが表示されませんでした。新しく開いたタブでcontent.jsコードを実行するには、新しいページがロードされるまでsetTimeoutを使用しました。

background.js

chrome.browserAction.onClicked.addListener(function(tab){ 
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs) { 
     var activeTab = tabs[0]; 
     chrome.tabs.sendMessage(activeTab.id,{"message":"browserAction"}) 
     }); 
}) 
chrome.runtime.onMessage.addListener(function(request,sender,sendResponse){ 
    if (request.message=="linkClicked"){ 
     var d = request.description 
     console.log(d) 
     if (d.indexOf('.')>=0){ //this will always evaluate to true and execute, leaving empty string |||| 
      var d = d.slice(0,d.indexOf('.')) //get a snippet of text 
     } 
    } 
    setTimeout(function(){chrome.storage.local.set({"keyName": d});},2000)//Delay 
})