共计 2384 个字符,预计需要花费 6 分钟才能阅读完成。
引子
依照 Chrome 扩大 : 欢送中的疏导,接触到的相干介绍。
- 原文:What are extensions?
- 版本:Last updated: Friday, March 12, 2021
- 源库:developer.chrome.com GitHub
- Origin
- My GitHub
扩大是什么?
本页简要介绍了 Chrome 扩大,并介绍了如何创立一个“Hello,World!”扩大。
对于扩大
扩大是定制浏览体验的小型软件程序。它们容许用户以多种形式定制 Chrome 的性能和行为,例如:
- 生产效率工具
- 丰盛网页内容
- 信息聚合
- 乐趣和游戏
这些只是扩大能够做的许多事件的几个例子。在 Chrome 网络商店 中能够看到成千上万个不同的已公布扩大示例。
扩大是如何工作的?
扩大是基于诸如 HTML、JavaScript 和 CSS 等 web 技术构建的。它们在独自的沙盒执行环境中运行,并与 Chrome 浏览器交互。
扩大容许你通过应用 API 批改浏览器行为和拜访 web 内容来“扩大”浏览器。扩大通过终端 UI 和开发人员 API 进行操作:
扩大用户接口:这为用户治理其扩大提供了统一的办法。
扩大 API:扩大 API 容许扩大的代码拜访浏览器自身的性能:激活选项卡、批改网络申请等等。
要创立扩大,你须要组装一些资源 — 一个 manifest、JavaScript 和 HTML 文件、图像和其它资源 — 这些资源组成了扩大。对于开发和测试,你能够应用 扩大开发人员模式 将这些“未打包”加载到 Chrome 中。一旦你对扩大感到称心,就能够打包并分发给用户。
用户如何取得扩大?
大多数 Chrome 用户从 Chrome 网络商店 取得扩大。寰球的开发者在 Chrome 网络商店中公布他们的扩大,在那里扩大被审查并提供给终端用户。
你能够通过 Chrome 开发人员仪表板散发扩大,并将其公布到 Chrome 网络商店。无关更多信息,请参阅 Chrome 网络商店开发者文档。
对于扩大准则的一个注意事项
Chrome 网络商店上的扩大必须恪守 Chrome 网络商店政策。在你开始时,请记住以下几点:
- 扩大必须实现一个严格定义且易于了解的繁多目标。一个繁多的扩大能够包含多个组件和一系列的性能,只有所有都有助于实现一个独特的目标。
- 用户界面应该是尽可能的小且能表白用意。它们能够是一个简略的图标,比方下面显示的 AMP validator 扩大,也能够是关上一个新窗口的表单,比方上面显示的 Google Similar Pages 扩大。
Hello extensions
通过这个疾速的 Hello extensions 示例,初步进入扩大。首先创立一个新目录来存储扩展名的文件,或者从示例页下载它们。
接着,创立名为 manifest.json
的文件,并蕴含以下代码:
{
"name": "Hello Extensions",
"description": "Base Level Extension",
"version": "1.0",
"manifest_version": 3
}
每个扩大都须要一个 manifest,只管大多数扩大仅仅依附 manifest 做不了多少事件。对于此疾速开始,扩大在 action 字段下申明了一个弹出文件和图标:
{
"name": "Hello Extensions",
"description": "Base Level Extension",
"version": "1.0",
"manifest_version": 3,
+ "action": {
+ "default_popup": "hello.html",
+ "default_icon": "hello_extensions.png"
+ }
}
下载 hello_extensions.png 并创立一个名为 hello.html
的文件。
<html>
<body>
<h1>Hello Extensions</h1>
</body>
</html>
这个扩大在点击图标时,将显示扩大 hello.html
。下一步是在 manifest.json
增加一个启用键盘快捷键的命令。这一步很乏味,但不是必须的:
{
"name": "Hello Extensions",
"description": "Base Level Extension",
"version": "1.0",
"manifest_version": 3,
"action": {
"default_popup": "hello.html",
"default_icon": "hello_extensions.png"
}
+ "commands": {
+ "_execute_action": {
+ "suggested_key": {
+ "default": "Ctrl+Shift+F",
+ "mac": "MacCtrl+Shift+F"
+ },
+ "description": "Opens hello.html"
+ }
+ }
}
最初一步就是在你本地设施上装置扩大。
- 在你的浏览器上导航到
chrome://extensions
。你还能够通过单击地址栏右上角的 Chrome 菜单,将鼠标悬停在 更多工具 上并抉择 扩大程序 来拜访此页。
- 开启 开发者模式。
- 点击加载已解压的扩大,抉择“Hello Extensions”扩大的文件夹。
祝贺!当初你能够通过点击 hello_world.png 图标或在键盘上按快捷键 Ctrl+Shift+F
来应用基于弹出窗口的扩大。
译者注
集体在依照文档做的时候,感觉有些中央漏了,增加了些补充:
- 加载了扩大,默认图标是不展现的,须要点击地址栏左边的扩大图标能力找到扩大。
- 依照下面的介绍,是须要一步一步本人增加,这是残缺版本示例,该示例中因为因为配置了
background
字段,所以在浏览器加载了扩大后,会马上关上一个 Tab 页面。
接下来呢?
- 接着入门教程。
- 摸索扩大示例。
- 订阅 chromium-extensions Google group。
参考资料
- Chrome Extensions : What are extensions?