2017-02-13 65 views
0

我正在製作一個Chrome擴展,它從搜索結果中獲取描述文本並將其存儲在鍍鉻存儲中。我使用chrome.storage.local.set來更改background-js中鉻存儲器中的值。然後,我訪問它在content.js。當我刪除onChanged.addListener()時,我的擴展程序正在工作,但我希望它只在Chrome存儲器內的值發生更改時纔會觸發。鉻存儲onChanged偵聽器未觸發

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" 
    ] 

} 
+1

也許值是一樣的存儲呢? – wOxxOm

+0

我不這麼認爲,因爲每個描述文字都不一樣,但我怎麼檢查? – st4rgut

+1

你已經將它打印到後臺控制檯,所以看看那裏。另外[在調試Chrome擴展時檢查chrome.storage.sync](// stackoverflow.com/a/32471596) – wOxxOm

回答

0

原來給onChanged監聽器發射。新頁面打開得太快,我無法在頁面中的鏈接中看到控制檯中的消息。要使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 
}) 
相關問題