所有类型的 Chrome 扩展脚本如何工作? [英] How do all types of Chrome extension scripts work?
问题描述
我是 Chrome 扩展程序的新手，想了解所有类型的脚本/页面的工作原理.
这是我的理解:
首先 - 有内容脚本"，这些脚本应该用于实际修改页面.
第二 - 有一个后台脚本"，旨在作为您发送和接收消息的服务器工作，但它不会修改页面的 DOM；因此它可以执行诸如处理存储和脚本之间通信之类的任务，但不修改页面.
最后 - 有弹出脚本"，它们与内容脚本和后台脚本分开，但您仍然可以在它们之间发送/接收消息.
弹窗脚本不能直接修改页面(和后台脚本一样)，只能发送消息给另外两个.
您根本没有在清单文件中声明它们，您可以直接在弹出的 html 文件中使用它们.
最终只有内容脚本才能真正修改页面.
我说得对吗?
一个 Chrome 扩展文档 一个链接来管理它们，一个链接找到它们，
一个链接将他们全部带到黑暗中bind()他们1:
:每个扩展只存在一个页面.它是不可见的，永远不会显示在选项卡中.通常，只要 Chrome 打开，它就会打开，但也有例外.由于它始终存在并且对 Chrome API 具有最高级别的访问权限，因此它经常用于扩展程序各部分之间的主要逻辑/事件路由.简而言之，背景工作.
活动页面/脚本:一种背景页面的变体，如果没有代码运行，则卸载.这节省了内存，但引入了维护状态的复杂性.Chrome 会记住应该监听哪些事件(通过 addListener)并在它们发生时再次加载页面.因此，活动页面.
除此之外，扩展可以有其他可见的页面.您只需在选项卡中打开它们(它们将具有 chrome-extension://extensionidgoeshere/page.html 地址)，并且它们将具有相同级别的 Chrome API 访问权限.不过，有两种 UI 类型是扩展程序所特有的:
浏览器/Page 操作弹出窗口: 通过单击相应的 UI 元素打开的小窗口.不幸的是，它也非常脆弱——一旦失去焦点，它就会关闭.除此之外，它只是一个扩展页面.
选项页面:有两种风格.第 1 版选项页面 只是一个在调用扩展选项时打开的选项卡；第 2 版选项页面 可以选择显示在 chrome://extensions/内的特殊框中.同样，除此之外，它只是一个具有扩展权限的页面.
最后，拥有一堆页面很有趣，但如果您想与现有页面/选项卡进行交互，则需要在其中注入脚本.
内容脚本是与页面一起运行的脚本；出于兼容性原因，它们在一个孤立的世界中运行.出于安全原因，他们在访问 Chrome API 方面受到严重限制.但它们与页面共享 DOM，因此可以对其进行修改.
页面级脚本 是您在文档中几乎找不到提及的内容(如 DOM 注入脚本")，但它们对于打破扩展 JavaScript 和页面自身 JavaScript 之间的障碍非常有用.这个答案 由宏伟的 Rob W.
定义了所有相关的扩展部分后，文档页面还简要提到了如何在它们之间进行通信.要更深入地了解这方面，请参阅 this answer(再次由 Rob W 提供)和 消息传递文档.><小时>
1 说真的，每个初级扩展开发者都需要阅读它，而且这个页面在文档中并不突出.干得好，谷歌.
I'm new to Chrome extensions and would like to understand how all types of scripts/pages work.
Here is my understanding:
First - there are "content scripts", ones that should be used to actually modify the pages.
Second - there is a "background script", designed to work like as a server that you send and receive messages from, but it does not modify the pages' DOM; so it can perform tasks like dealing with storage and communicating between scripts but not modifying the page.
Lastly - there are "popup scripts", they are separated from both content scripts and background scripts, but you can still send/receive messages between them.
The popup scripts can NOT directly modify the page (same as background script), they can only send messages to the other two.
You do not declare them at all in the manifest file, you can just go straight and use them in your popup html file.
In the end only the content scripts can eventually actually modify a page.
Am I correct?
One Chrome extension documentation Link to rule them all, One Link to find them,
One Link to bring them all and in the darkness bind() them1:
>> Architecture Overview <<
(artist's impression)
It should answer many of your questions. However, that would be a bad SO answer, so a summary from me:
Background page/scripts: Only one page exists per extension. It is invisible and can never be displayed in a tab. Normally, it is open as long as Chrome is open, though there are exceptions. Since it's always there and has the highest level of access to Chrome APIs, it's frequently used for main logic / event routing between parts of the extension. In short, background work.
Event page/scripts: A variant of background pages that are unloaded if there is no code running. This saves memory, but introduces complexity as to maintaining state. Chrome remembers which events should be listened to (via addListener) and loads the page again when they happen. Hence, event page.
Besides that, extension can have other, visible pages. You can just open them in a tab (they would have chrome-extension://extensionidgoeshere/page.html address), and they will have same level of access to Chrome API. Two UI types are special to extensions though:
Browser/Page Action popup: A small window that's opened with a click on the corresponding UI element. Unfortunately, it's also very fragile - it will close as soon as it loses focus. Other than that, it's just an extension page.
Options page: Comes in two flavours. Version 1 Options page is just a tab that's opened when invoking options for an extension; Version 2 Options page can optionally show in a special box inside chrome://extensions/. Again, other than that it's just a page with extension privileges.
Finally, having a bunch of pages is fun, but if you want to interact with existing pages/tabs, you'll need to inject scripts in them.
Content Scripts are scripts that run alongside pages; for compatibility reasons, they run in an isolated world. For security reasons, they are severely limited in access to Chrome API. But they share the DOM with the page, and as such can modify it.
Page-level Scripts is something you barely find mentioned in documentation (as "DOM injected scripts"), but they are very useful to break the barrier between extension JavaScript and page's own JavaScript. A good overview of them is presented in this answer by the magnificent Rob W.
Having defined all relevant extension parts, the documentation page also briefly mentions how to communicate between them. For a more in-depth look into this aspect, see this answer (again by Rob W) and the Messaging documentation.
1 Seriously though, every beginning extension developer needs to read that, and this page is not prominent the documentation. Good job, Google.
这篇关于所有类型的 Chrome 扩展脚本如何工作?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
