Question

我找到了关于如何获取当前选项卡的页面源的答案： Getting the source HTML of the current page from chrome extension

但是，此答案要求用户按扩展名弹出窗口。

我想知道加载页面时如何访问页面源（无需调用弹出窗口）。

在我的background.js中，我已经很累了：

chrome.tabs.onUpdated.addListener(function (tabId , info) {
  console.log(info)

  chrome.tabs.executeScript(null, {
    file: "getPagesSource.js"
  }, function() {
    if (chrome.runtime.lastError) {
      message.innerText = 'There was an error injecting script : \n' + chrome.runtime.lastError.message;
    }
  });
});

但这会导致以下错误：

注入脚本时出错：无法访问内容页。扩展清单必须请求权限才能访问各自的主机。

我的manifest.js：

{
    "name": "Getting Started Example",
    "version": "1.0",
    "description": "Build an Extension!",
    "permissions": ["declarativeContent",
                    "https://www.example.com/*",
                    "storage",
                    "activeTab"],
    "background": {
        "scripts": ["background.js"],
        "persistent": false
      },
    "content_scripts": [
      {
        "matches": [
          "<all_urls>"
        ],
        "js": ["content.js"]
      }
    ],
    "options_page": "options.html",
    "manifest_version": 2,
    "page_action": {
        "default_popup": "popup.html",
        "default_icon": {
            "16": "images/get_started16.png",
            "32": "images/get_started32.png",
            "48": "images/get_started48.png",
            "128": "images/get_started128.png"
          }
    },
    "icons": {
        "16": "images/get_started16.png",
        "32": "images/get_started32.png",
        "48": "images/get_started48.png",
        "128": "images/get_started128.png"
      }
  }

我认为问题不是真正的权限问题，因为我可以从popup.html（page_action脚本）获取页面源代码。但是我无法通过“背景”或“ content_scripts”获得它。为什么会这样？完成此操作的正确方法是什么？

Answer 1

关于权限。
您的示例有点不足，但是正如我所看到的，您正在使用“ activeTab”权限。

根据activeTab docs，在执行以下任何操作后，扩展程序将可以访问（例如，源）当前选项卡：

执行浏览器操作

执行页面操作

执行上下文菜单项

从命令API执行键盘快捷键

接受来自多功能框API的建议

这就是为什么您可以在打开弹出窗口后获取资源。

为了不使用这些操作即可访问选项卡，您需要请求以下权限：

tabs
<all_urls>

请注意，它允许您在每个选项卡上运行content-script，而不仅仅是活动的选项卡。

这是最简单的示例：

manifest.json

{
  "name": "Getting Started Example",
  "version": "1.0",
  "description": "Build an Extension!",
  "permissions": ["tabs", "<all_urls>"],
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "manifest_version": 2
}

background.js

chrome.tabs.onUpdated.addListener(function (tabId, info) {
    if(info.status === 'complete') {
        chrome.tabs.executeScript({
            code: "document.documentElement.innerHTML" // or 'file: "getPagesSource.js"'
        }, function(result) {
            if (chrome.runtime.lastError) {
                console.error(chrome.runtime.lastError.message);
            } else {
                console.log(result)
            }
        });
    }
});

chrome扩展程序：在页面加载时获取当前页面的源HTML

1 个答案: