Question

我正在处理简单的Chrome扩展程序，目的是打开entry类的页面上的每个链接。目前，我有这个......

的manifest.json ：

{
    "manifest_version": 2,

    "name": "Hello World",
    "description": "A simple Chrome Extension",
    "version": "1.0",

    "background": {
        "scripts": ["openlinks.js"],
        "persistent": true
    },

    "permissions": [
        "tabs",
        "http://*/",
        "https://*/"
    ],
    "browser_action": {
        "default_icon": "logo.png"
    }
}

openlinks.js ：

chrome.browserAction.onClicked.addListener(function(tab) {
    var linkArray = ['https://www.google.com', 'http://www.bbc.co.uk']; // your links
    for (var i = 0; i < linkArray.length; i++) {

    chrome.tabs.create({
        url: linkArray[i]
    });
}
});

现在我正在尝试使用当前选项卡中的链接数组替换示例链接数组。是否只是使用标准JavaScript或jQuery来实现这一目标？

Answer 1

看看Chrome Extensions Overview # Architecture，因为你需要一个事件页面和一个内容脚本来实现这一目标。

以下是我将如何解决这个问题的概述：

清单结构（事件页面+ activeTab权限）。

"background": { "scripts": ["bg.js"], "persistent": false },
"permissions": ["activeTab"],
"browser_action": {},

单击浏览器操作后，浏览器将授予访问当前选项卡的权限，我们使用该选项卡注入脚本。请参阅Content Scripts # Programmatic Injection。
```
// bg.js
chrome.browserAction.onClicked.addListener(tab =>
  chrome.tabs.executeScript({file: 'content.js'});
});
```

内容脚本有权访问DOM并使用message passing，但受限于大多数扩展API（特别是chrome.tabs）。

// content.js
message = {}
message.links = [...document.querySelectorAll(
        'div.question-summary a.question-hyperlink')].map(e=>e.href);
chrome.runtime.sendMessage(message);

后台页面会侦听该消息。

// bg.js
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  request.links.forEach(link => chrome.tabs.create({url: link});
});

打开一系列链接

1 个答案: