Question

我正在撰写Chrome扩展程序，该扩展程序可识别某些网址格式并执行进一步的DOM操作。内容脚本必须获取当前URL并与预定义的URL模式列表匹配。

我可以通过两种方式来实现目标：第一个是使用location.href

的manifest.json

<h1 align="center">Last Week's Photo Features</h1>
<div style="text-align:center;">
<img src="CaliforniaKelp.jpg" style="display:inline-block;"  />
<img src="RockyMountains.jpg" style="display:inline-block;" />
</div>
<p>Lorem ipsum dolor sit amet, novum alienum percipit eum ne. Vel ne paulo inermis, natum numquam vix ei, ex pri dicit blandit vituperata. Ne vel porro clita, aperiam consetetur referrentur mea et, per falli ornatus adolescens ex. Sea doming comprehensam ad, vim te aeque melius.</p>
<p>Lorem ipsum dolor sit amet, novum alienum percipit eum ne. Vel ne paulo inermis, natum numquam vix ei, ex pri dicit blandit vituperata. Ne vel porro clita, aperiam consetetur referrentur mea et, per falli ornatus adolescens ex. Sea doming comprehensam ad, vim te aeque melius.</p>

content.js

...
"content_scripts": [
  {
    "matches": ["<all_urls>"],
    "js": ["content.js"],
    "run_at": "document_end"
  }
],
...

此方法正常。但是，在StackOverflow上的其他类似问题中，他们通常建议使用chrome.tabs和从后台脚本发送消息到内容脚本，如下所示：

的manifest.json

console.log(location.href);

background.js

...
"background" : {
    "scripts": ["background.js"]
},
"content_scripts": [
  {
    "matches": ["<all_urls>"],
    "js": ["content.js"],
    "run_at": "document_end"
  }
],
...

content.js

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
    chrome.tabs.get(tab.id, function(tabInfo) {
        chrome.tabs.sendMessage(tab.id, {
            url: tabInfo.url
        }, function(response) {
        });
    })
});

两种方法都可以正确使用URL。对于后台脚本，与仅在加载页面时注入的内容脚本相比，它需要额外的内存来保持后台脚本在后台运行。

另一方面，使用后台脚本有好处，因为后台脚本被认为是特权，它可以执行特权Chrome API，如chrome.tabs API。

因此，就我没有使用任何特权API而言，我应该使用location.href还是有任何特殊原因，大多数开发人员建议使用chrome.tabs和消息发送？

Answer 1

后台网页脚本的优点：

使用Tab object中的其他信息进行复杂检查（NB添加"tabs"权限以访问url，title，favIconUrl），而清单基于.json的注入仅限于URL wildcards/globs。
- chrome.declarativeContent API是高级过滤的示例，它根据URL检查和DOM内容（仅文档中提到的简单选择器）注入内容脚本。
- chrome.browserAction.onClicked仅在需要时注入内容脚本。
更改工具栏图标或浏览器上下文菜单以反映状态变化;内容脚本不能这样做，后台页面脚本可以。
像大多数chrome。*，扩展程序的内部存储一样访问特权API，例如IndexedDB，WebSQL，HTML5 FileSystem，localStorage（后者不是一个好选择，因为它不能直接在内容脚本中使用，而且它是同步，从而阻止执行。）

在上述所有情况下，如果在检查条件时使用了数据，或者仅在后台脚本中可用，则使用消息将数据传递到内容脚本是有意义的。否则，内容脚本中的chrome.storage API一样好，或者可读性更好。

满足所有这些条件后，“无背景”内容脚本会更好：

要处理的网址可以完全使用通配符/ globs设置，或者它实际上必须是<all_urls>
所有必需参数均可通过chrome.storage API访问，或无需参数
没有特权Chrome。* API在内容脚本中用作aren't available，换句话说，用于实际不需要背景页。

至于内存消耗：根据使用方式的不同，任何一种方法都可能更好或更差如果在所有页面上都注入了内容脚本，那么每个实例都会消耗内存（有些人会打开100个标签，所以要小心！）。最糟糕的情况显然是在使用所有URL上的持久性后台页面和内容脚本时。非持久性事件页面可能有所帮助，但有限的方式是因为chrome.tabs.onUpdated可能会频繁地运行，迫使事件页面重新加载（这也需要一些时间）。

我应该使用location.href或chrome.tabs.query发送消息来获取标签网址吗？

1 个答案: