Purple-adblock 开源项目使用教程

Purple-adblock 开源项目使用教程

Purple-adblockAdblock for the twitch using server side signature项目地址:https://gitcode.com/gh_mirrors/pu/Purple-adblock

1. 项目的目录结构及介绍

Purple-adblock 项目的目录结构如下：

Purple-adblock/
├── README.md
├── background.js
├── content.js
├── manifest.json
├── options.html
├── options.js
└── styles.css

• README.md: 项目介绍和使用说明。
• background.js: 扩展的后台脚本，负责处理扩展的主要逻辑。
• content.js: 内容脚本，注入到 Twitch 页面中，用于拦截和处理广告。
• manifest.json: 扩展的清单文件，包含扩展的基本信息和配置。
• options.html: 扩展的设置页面。
• options.js: 设置页面的脚本。
• styles.css: 扩展的样式文件。

2. 项目的启动文件介绍

Purple-adblock 的启动文件主要是 background.js 和 content.js：

• background.js: 这个文件是扩展的后台脚本，负责管理扩展的生命周期和全局状态。它会在扩展安装或浏览器启动时运行。
• content.js: 这个文件是内容脚本，它会注入到 Twitch 页面中，负责拦截和处理视频广告。

3. 项目的配置文件介绍

Purple-adblock 的配置文件是 manifest.json：

{
  "manifest_version": 2,
  "name": "Purple Adblock",
  "version": "1.0",
  "description": "Adblock for the Twitch.tv using server side signature and local m3u8 manipulation.",
  "permissions": [
    "webRequest",
    "webRequestBlocking",
    "https://*.twitch.tv/*"
  ],
  "background": {
    "scripts": ["background.js"]
  },
  "content_scripts": [
    {
      "matches": ["https://*.twitch.tv/*"],
      "js": ["content.js"],
      "css": ["styles.css"]
    }
  ],
  "options_ui": {
    "page": "options.html",
    "open_in_tab": true
  },
  "browser_action": {
    "default_icon": {
      "16": "icons/icon16.png",
      "48": "icons/icon48.png",
      "128": "icons/icon128.png"
    },
    "default_title": "Purple Adblock"
  }
}

• manifest_version: 指定清单文件的版本，目前为 2。
• name: 扩展的名称。
• version: 扩展的版本号。
• description: 扩展的描述。
• permissions: 扩展所需的权限，包括网络请求和 Twitch 页面的访问权限。
• background: 后台脚本的配置。
• content_scripts: 内容脚本的配置，指定注入的页面和脚本文件。
• options_ui: 设置页面的配置。
• browser_action: 浏览器按钮的配置，包括图标和标题。

以上是 Purple-adblock 开源项目的详细使用教程，希望对您有所帮助。

Purple-adblockAdblock for the twitch using server side signature项目地址:https://gitcode.com/gh_mirrors/pu/Purple-adblock