从 0 到 1 带你开发 Chrome 浏览器 Manifest V3 版本插件

前端

2023-10-09 17:16:48

Chrome 浏览器插件：通过 Manifest V3 提升浏览体验

什么是 Chrome 浏览器插件？

想象一下，你可以通过一些额外的功能来提升你的 Chrome 浏览体验，比如屏蔽烦人的广告、翻译语言不通的网站，甚至玩小游戏。这些便利的功能就是 Chrome 浏览器插件的魅力所在。

插件是如何构建的？

这些插件是使用 HTML、CSS 和 JavaScript 等常见 Web 技术构建的。它们最重要的组成部分是 "manifest.json" 文件，它提供了插件的基本信息，包括名称、版本和权限。

Manifest V3：提升插件的安全性和隐私性

为了提高安全性、隐私性和性能，Chrome 浏览器推出了 Manifest V3，这是插件开发的新标准。

更安全： V3 插件无法访问您的浏览历史记录，这意味着它们无法收集您的私人信息。
更私密： V3 插件只能访问您明确授予的权限，从而限制了它们访问数据的范围。
更高效： V3 插件在后台运行时消耗的资源更少，从而提升了 Chrome 浏览器的性能。

如何使用 Manifest V3 开发插件

要使用 V3 开发插件，您需要在 "manifest.json" 文件中指定插件的权限，并创建一个包含插件代码的 JavaScript 文件。

示例：从零开始使用 V3 创建插件

让我们动手创建一个简单的插件，它会在您访问任何网站时在控制台中打印 "Hello, world!"。

// manifest.json
{
  "manifest_version": 3,
  "name": "Hello World Plugin",
  "version": "1.0.0",
  "description": "A simple plugin to say hello",
  "permissions": ["tabs"],
  "content_scripts": [
    {
      "matches": ["https://*/*"],
      "js": ["content.js"]
    }
  ],
  "background": {
    "service_worker": "background.js"
  }
}

// content.js
console.log("Hello, world!");

// background.js
console.log("Hello, world!");