
深度解析智慧树刷课插件的manifest.jsonChrome扩展开发的完整入门教程【免费下载链接】zhihuishu智慧树刷课插件自动播放下一集、1.5倍速度、无声项目地址: https://gitcode.com/gh_mirrors/zh/zhihuishu智慧树刷课插件是一款极简却完整的 Chrome 扩展打开智慧树课程页面后它会自动播放下一集、以 1.5 倍速无声播放让你彻底解放双手 而读懂这个插件的关键藏在它的身份证文件 manifest.json 里。本文就是一份 Chrome 扩展开发入门教程——从一个不足 20 行的 manifest.json 出发带你逐字段读懂 Chrome 插件的运作原理并手把手教你在本地加载运行它。为什么从 manifest.json 入手学 Chrome 扩展开发学习浏览器插件开发最容易踩坑的就是文件一堆不知道谁是谁。而智慧树刷课插件恰好是最理想的入门样本✅ 文件极少整个项目只有 5 个核心文件一次就能读透✅ 麻雀虽小五脏俱全完整覆盖了 Chrome MV2 扩展的三大核心机制✅ 真实可用不是玩具示例而是真正解决网课自动播放痛点的工具项目文件清单一个 Chrome 扩展的最小结构文件作用manifest.json扩展清单文件声明名称、版本、注入规则插件的总开关content.js内容脚本负责把核心脚本注入到目标网页zhihuishu.js核心逻辑脚本自动下一集、1.5 倍速、静音播放popup.html点击工具栏图标后弹出的说明页面icon.png工具栏扩展图标README.md功能说明与安装教程 新手记住一个心法浏览器靠 manifest.json 认识你的插件靠 content_scripts 进入网页靠 web_accessible_resources 拿到资源。逐行读懂 manifest.json 的 7 个核心字段打开 manifest.json你会看到 7 个字段每一个都有明确分工1. manifest_version选择扩展规范版本值为2表示遵循 Chrome 扩展 Manifest V2 规范新版的 MV3 对后台脚本和权限做了调整本项目属于经典的 MV2 写法非常适合理解基础机制。2. name 与 description插件的身份与简介name智慧树刷课插件description智慧树视频自动播放下一集1.5 倍速度无声播放这两项会直接展示在扩展管理页中是用户了解你插件功能的第一窗口写清楚能做什么比写得多花哨更重要。3. version版本管理1.0表示当前版本。功能迭代时更新它方便用户分辨新旧版本也是发布扩展的必备字段。4. browser_action工具栏按钮三件套manifest.json 中的browser_action定义了浏览器工具栏上那个小图标的行为子字段值含义default_iconicon.png工具栏显示的图标default_popuppopup.html点击图标后弹出的页面default_title智慧树刷课插件鼠标悬停时显示的提示文字点击图标会弹出 popup.html里面就两段提示文字——它验证了扩展安装成功也是新手最容易忽略的交互入口。5. content_scripts把脚本注入网页的钥匙 这是新手最需要理解的一段配置见 manifest.json子字段值含义matches*://*.zhihuishu.com/*只在智慧树域名下生效通配符匹配所有子页面jscontent.js要注入的脚本文件run_atdocument_end等页面 DOM 解析完成后再注入三个细节值得新手注意matches用的是类 glob 通配语法*可以匹配协议、任意子域名和路径这就是插件只在智慧树生效的原因run_at有三个时机文档开始、空闲时、文档结束选document_end可以确保页面结构已存在脚本注入更稳妥想改插件作用网站只需改这一行——这也是 Chrome 扩展开发入门中最常练习的修改点。6. web_accessible_resources把资源暴露给网页manifest.json 中这一行看似不起眼却是整个插件能跑起来的关键它声明zhihuishu.js可以被目标网页访问。没有这行内容脚本就无权把核心脚本加载进页面插件将直接失效。两大脚本如何配合从注入到自动刷课content.js一座过桥脚本 content.js 只有 6 行职责单一在扩展环境下通过chrome.extension.getURL拿到zhihuishu.js的地址动态创建一个script标签并挂到页面上。这里体现了 Chrome 扩展的一条重要规则扩展资源默认不能被普通网页引用必须经过 content.js 这座桥 web_accessible_resources的通行证核心脚本才能进入页面运行环境。zhihuishu.js刷课核心逻辑的 4 个步骤进入页面后zhihuishu.js 按顺序完成 4 件事等页面就绪window.onload后再延迟 5 秒给智慧树的页面元素留出加载时间自动播放下一集找到章节列表#chapterList遍历每一项找到未观看watchstate为0或2的条目并模拟点击自动进入下一集特殊效果把视频定位到第 2 秒重新起播点击.volumeIcon静音再点击.speedTab15切换到 1.5 倍速后台巡检每 10 秒检查一次——视频播完就刷新页面进入下一集弹出测试对话框就先答题、再关闭对应 zhihuishu.js 的background函数。 对新手来说这个项目的精髓在于不是自己去操作视频而是模拟点击页面上现成的控件——找到按钮、触发 click这是页面自动化脚本最常用、也最稳的思路。3 步在本地加载运行插件加载已解压扩展教程学会了配置最后动手跑起来。整个过程不到 2 分钟 ⚡获取源码执行git clone https://gitcode.com/gh_mirrors/zh/zhihuishu把源码解压到一个你喜欢的目录加载扩展在 Chrome 中打开chrome://extensions勾选右上角的开发者模式点击加载已解压的扩展程序选择刚才的源码目录开始刷课登录智慧树并进入课程视频页面稍等片刻插件就会自动 1.5 倍速无声播放播完自动进入下一集 ✅加载成功后扩展列表中会出现智慧树刷课插件确认其开关为已启用状态即可。新手常见问题FAQ❓Q为什么没有实现 1.5 倍速、无声播放A按F5刷新页面让脚本重新注入即可。Q页面没有自动播放A请先登录智慧树再开启本插件。未登录状态下页面结构不完整脚本找不到播放器。Q插件会在所有网站生效吗A不会。manifest.json 中matches字段把它严格限制在zhihuishu.com域名下这正是内容脚本按需注入的意义。Q可以改造成其他网课网站吗A理论上可以。你需要修改matches目标域名并按新页面重新定位播放器控件参见 zhihuishu.js 中的getElement函数。项目采用 LICENSE MIT 协议可自由学习与修改。写在最后一份 Chrome 扩展开发学习路线 回顾这篇 Chrome 扩展开发入门教程我们完整走通了学习闭环读清单通过 manifest.json 认识 name、version、browser_action、content_scripts、web_accessible_resources 五大字段懂机制理解 content.js 注入 web_accessible_resources 授权的两步协作跑起来用加载已解压的扩展程序在本地运行 zhihuishu.js 的刷课逻辑动脑子试着修改matches换一个目标网站挑战定位新的播放控件。一个不到 20 行的 manifest.json就是通往浏览器扩展开发世界的最短路径。现在打开你的 Chrome动手加载第一个插件吧【免费下载链接】zhihuishu智慧树刷课插件自动播放下一集、1.5倍速度、无声项目地址: https://gitcode.com/gh_mirrors/zh/zhihuishu创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考