8

我目前正在开发 chrome 扩展程序，源代码可在 Github 上找到。目标是将自定义 Javascript 注入网页。

目前，我将每个自定义 Javascript Inject存储在localStorage并从content scipts调用它们。我已将run_at设置为document_start。

我使用它来从后台脚本获取存储的注入：

chrome.extension.sendMessage({method:"get_injects"},function(injects){
    for(index in injects){
        if(/^items\./.test(index)){
            itemJSON = injects[index];
            //if(window.location.host.toString().indexOf(itemJSON.url)){
            if(window.location.host.toString().match(itemJSON.url + '$')){
                var js = itemJSON.js.toString();
                eval(js);
            }
        }
    }
});

问题

我想在文档加载之前运行注入脚本。 但是使用提出的方法，控制将通过并且不会等待得到响应。因此，将在页面加载的中间执行。我该如何解决这个问题，以便我能够在页面加载之前注入？chrome.extension.sendMessageinjectseval(js);

4

2 回答 2

4

在 Chrome 中，每个选项卡都在自己的进程中运行。后台页面在扩展过程中运行，这与您要挂接的选项卡之一不同。所以恐怕没有真正同步的解决方案。

即使使用chrome.storage（没有来源限制，因此不需要背景页面）也是异步的。

但这里有一个适用于大多数页面的解决方案：

  1. 如果你需要的数据在页面的localStorage中，执行6
  2. 从页面中删除所有内容
  3. 对数据进行异步请求
  4. 当您有数据时，将其存储在页面的 localStorage 中（不是后台）
  5. 用相同的 URL 刷新页面
  6. 利润
于 2013-03-28T09:18:18.017 回答
2

有一种方法可以从后台页面同步获取任意数量的数据到当前内容脚本。你应该避免在你的扩展中同步阻塞代码，所以我不会提供示例代码，以阻止在生产代码中复制粘贴。

流程是：

  1. 在内容脚本中使用同步XMLHttpRequest（到虚假 URL）来启动这些步骤。
  2. 在后台页面，使用chrome.webRequest.onBeforeRequest事件拦截这个请求。
  3. 同步获取数据，例如从localStorage后台页面或本地变量中获取数据，将其转换为 blob，然后使用var url = URL.createObjectURL(new Blob([ 'data chunks here' ]));.
  4. return {redirectUrl: url};在事件中使用onBeforeRequest以发回数据。
  5. 确保您最终用于URL.revokeObjectURL(url);释放数据所使用的资源。

最后，尽可能避免同步、阻塞代码！

于 2014-06-10T21:01:10.010 回答