Chrome插件开发专题

什么是Chrome插件？

Chrome插件（也称扩展）是为Google Chrome浏览器开发的小型软件程序，用于增强或修改浏览器的功能。它们可以拦截网页内容、添加工具栏按钮、管理书签、自动填写表单等。

开发前的准备

• 安装最新版 Google Chrome 浏览器
• 熟悉 HTML、CSS 和 JavaScript 基础
• 了解 Chrome 扩展的基本结构：manifest.json、background scripts、content scripts 等

核心组成部分

1. manifest.json：插件的配置文件，定义名称、版本、权限、入口脚本等。
2. Background Script：后台运行的逻辑，用于监听事件或执行长期任务。
3. Content Script：注入到网页中的脚本，可读取或修改页面内容。
4. Popup / Options 页面：用户交互界面，通常以弹窗或设置页形式出现。

简单示例：Hello World 插件

创建一个在点击扩展图标时弹出“Hello, Chrome Extension!”的插件：

// manifest.json
{
  "manifest_version": 3,
  "name": "Hello World",
  "version": "1.0",
  "action": {
    "default_popup": "popup.html"
  }
}

<!-- popup.html -->
<script src="popup.js"></script>
<button id="hello">Say Hello</button>

// popup.js
document.getElementById('hello').onclick = () => alert('Hello, Chrome Extension!');

调试与发布

开发完成后，可通过 Chrome 的 chrome://extensions 页面加载未打包的扩展进行测试。正式发布可上传至 Chrome 应用商店。