如何正确传递数据到contentscript？

我要解决以下问题：我有一个弹出窗口，并在那里有popup.html一个选择标签：如何正确传递数据到contentscript？

<select id="chart_select"> 
           <option id="chart_0" value="default">Select One</option> 
           <option id="chart_1" value="table_1">DISPLAY CLIENT VERSION USAGE CHART</option> 
           <option id="chart_2" value="table_2">DISPLAY MOST ACTIVE REALMS CHART</option> 
           <option id="chart_3" value="table_3">DISPLAY MOST ACTIVE USERS CHART</option> 
           <option id="chart_4" value="table_4">DISPLAY AVERAGE USER FRAMERATE CHART</option> 
           <option id="chart_5" value="table_5">DISPLAY AVERAGE REALM FRAMERATE CHART</option> 
           <option id="chart_6" value="table_6">DISPLAY USER LOGGED IN '' TIMES CHART</option> 
           <option id="chart_7" value="table_7">DISPLAY LOGINS per ORGANISATION</option> 
          </select>

所以，我保存到localStorage['thetable']选定的价值。例如，我选择DISPLAY LOGINS per ORGANISATION，然后我将"table_7"保存到本地存储。

然后，在background.html我想从localStorage的数据传递给我的内容脚本，像这样：

if(localStorage.getItem('thetable') != ""){ 
    chrome.tabs.getSelected(null, function(tab) { 
     chrome.tabs.sendRequest(tab.id, {thetable: localStorage.getItem('thetable') }, function(response) { 
      if(response.dom != ""){ 
       localStorage.setItem('thedom',response.dom); 
      } 
     }); 
    }); 
}

在此之后，我contentscript应该捕获请求，并发回与DOM，响应其已由id指定，存储在localStorage（'thetable'）中。

contentscript.js: 

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) { 
    if (request.thetable != "") { 
     sendResponse({dom: document.getElementById(request.thetable).innerHTML}); 
    } 
});

注：request.thetable应该是 “table_7”。 dom应该是该网站的<table id="table_7">的innerHTML。它存在，我做了所有这些元素。

另外一个信息，我保存选择值在不同的文件中，在popup.js，我保存“table_7”localStorage在这个文件中。但localStorage也可以从background.html获得，所以我认为它不应该是一个问题。

流程：

我选择的东西（FE：每个组织DISPLAY LOGINS）
我popup.html点击"Save Btn"，然后popup.js节省 “table_7” 到localStorage的
然后我点击“运行Btn”popup.html，然后popup.js重新加载当前标签：

chrome.tabs.getSelected（null，function（tab）{ chrome.tabs.reload（tab.id）; }）;

我这样做，因为我的内容收集信息只有当标签是重新加载。
重装之后，我想，background.html应该发送请求 contentscript与info（ “table_7”）
contentscript得到DOM，从网站，FE：document.getElementById("table_7").innerHTML并发送回这backgound页。

的问题是，我得到这个警告，当我运行的流程： enter image description here

有人可以帮我，如何解决这个问题？：/感谢

来源

2012-05-05 Jim-Y

而不是重新加载标签来激活内容脚本，我建议使用['chrome.tabs.executeScript（tab.id，{文件：“name_of_script.js”}）; ']（http://code.google.com/chrome/extensions/tabs.html#method-executeScript）运行内容脚本。 –

然后我得到'在错误期间tabs.executeScript：未知的错误。 chromeHidden.handleResponse'在控制台中。顺便说一下，如何强制后台脚本发送请求？ –

你能发布一个最小的测试用例（包括清单文件的相关部分）吗？ –

我找到了一个解决方案：

弹出。JS： 与保存按钮，我保存的选择的值（= “* table_7 *”），并重新加载所选择的标签：

$("#save_btn").click(function(){ 
     if($("#chart_select :selected").val()!="default"){ 
      var sel_val = $("#chart_select :selected").val(); 
      localStorage.setItem('thetable',sel_val); 
      chrome.tabs.getSelected(null,function(tab){ 
       chrome.tabs.reload(tab.id); 
      }); 
     } 
    });

只要网站被重新加载，content_script.js获得焦点：

content_script.js：

// SEND DOM structure to the background page 
chrome.extension.sendRequest({ action: "waiting" },function(response){ 
    if(response){ 
     chrome.extension.sendRequest({ dom: document.getElementById(response.thetable).innerHTML }); 
    } 
});

该代码向后台页面发送“等待”请求，并等待响应，响应已到，代码获取页面DOM并将其发回。所以它是一个嵌套的sendRequest。

background.html：

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) { 
    if(request.action=="waiting"){ 
     sendResponse({thetable:localStorage.getItem('thetable')}); 
     chrome.extension.onRequest.addListener(function(request, sender, sendResponse) { 
      if(request.dom){ 
       localStorage.setItem('thedom',request.dom); 
      } 
     }); 
    } 
});

如果等待的请求已经到来，注：等待是由内容脚本，送回来的ID（ “table_7”）记：通过popup.js将table_7保存到localStorage中，在发回id（thetable）后，代码侦听响应，如果响应已到，则将其保存到localStorage。在此之后，“table_7”的DOM被保存。

完成工作，我在popup.js中处理数据。注：现在的数据是localStorage('thedom')

来源

2012-05-05 19:14:07

如何正确传递数据到contentscript？

回答

相关问题