Question

我正在构建我的第一个Chrome扩展程序。我已经浏览了Chrome开发人员文档，但我无法理解一些主题。

我明白了：

有两个动作：
- 浏览器操作（地址栏外的按钮）
- 页面操作（地址栏内的按钮）
对于这两项操作，我们都有背景页：
- 浏览器操作的背景页面可以是background.html或background.js
- 或background.html或eventPage.js进行网页操作

我正在使用页面操作。对于默认弹出页面，我使用了popup.html。

现在background.html和eventPage.js适合哪些地方（尤其是background.html，因为我已经拥有popup.html，我是否需要呢？）

eventPage.js应该有什么？ background.html应该有什么？

Answer 1

在manifest.json，如果你正在使用"event page"（建议减少扩展程序的内存使用），你会有类似

的内容

{
  ...
  "background": {
    "scripts": ["eventPage.js"],
    "page": "eventPage.html"
    "persistent": false
  },
  ...
}

现在，上面的清单实际上无法运行："scripts"字典中只能包含"page"或"background"键的一个。最简单的方法是定义"scripts"。然后你可以编写一堆javascript，让它运行以响应chrome.runtime.onMessage和chrome.pageAction.onClicked等各种事件。

您在"scripts"键中列出的JavaScript会在HTML文档的上下文中运行，并且可以在document.createElement()运行时使用browser action等DOM API。默认情况下，Chrome会生成以下格式的文档：

<html>
  <head></head>
  <body>
    <script src="event.js"></script>
  </body>
</html>

保存您列出的脚本。你会在chrome：// extensions /中看到这个，如果你点击＆＃34;后台页面＆＃34;链接在＆＃34;检查视图＆＃34;旁边。但是，有时您可能希望该文档具有预定义的更多元素。我见过这样的例子：

<html>
  <head></head>
  <body>
    <script src="event.js"></script>
    <canvas width="300" height="400" id="the_canvas"></canvas>
  </body>
</html>

所以event.js可以使用document.getElementById('the_canvas')来检索它可以绘制的画布。如果没有自定义文档，您的javascript仍然可以运行：

var canvas = document.createElement('canvas');
canvas.width = 300;
canvas.height = 400;

并获得相同的结果，但文档可以更容易。该HTML文件是您在清单中放入background.page密钥的内容。

正如@SirDemon所提到的，如果你把所有东西放到page action的弹出窗口中，你有时可以完全没有背景/事件页面。由于{{3}}仅适用于与其相关的网页，因此您通常需要一个背景/事件页面来控制网页操作。

Answer 2

您不一定需要背景页面或后台脚本。如果您打算创建一个不需要任何人工交互的扩展，那么您需要它们。

页面和浏览器操作通常意味着您打算使用某种UI，因此不需要背景资料。只需将您的脚本等添加到您的主要＆＃39; default_popup＆＃39;正常情况下的html页面。

我何时以及为什么需要background.html或background.js？

2 个答案: