ARTICLE DETAIL

资讯详情

深耕网站视觉设计与运营推广的一线实战洞察。

油猴插件使用指南:从安装到脚本管理,让Chrome更强大

油猴插件使用指南:从安装到脚本管理,让Chrome更强大 前几天朋友发来消息说他的谷歌浏览器越用越卡网页广告比正文还长想下载的视频找不到门路问我有什么办法。我回了他一句先把浏览器重装一遍然后装一个油猴插件Tampermonkey。他半信半疑照着操作半个小时后回来发了三个字真的香。油猴插件可能是整个Chrome插件体系里被低估最多的一个工具。它不是一个具体功能而是一个容器——一个负责加载、运行、管理各种“用户脚本”的扩展。你可以把它理解成给网站打补丁的工具网页源代码你改不了但脚本能在页面加载时自动替你改相当于你的浏览器戴上了一副自定义的眼镜想怎么看页面由你自己说了算。这篇教程不打算给你念说明书我把这几年折腾用户脚本的真实体验、踩过坑、绕过的弯一次性捋清楚。从安装到配置从找脚本到排查问题从安全意识到维护习惯尽量讲得能直接拿来用。1. 油猴插件到底是什么它凭什么敢叫“插件的插件”1.1 用户脚本的工作方式给网页“打补丁”Tampermonkey官方身份是“用户脚本管理器”这个说法太正式了。说人话就是你用JavaScript写一小段代码指定它在哪些网站上运行Tampermonkey负责把它注入到对应网页里让代码自动执行。这套机制有个专门的名字叫“用户脚本”userscript油猴插件则是目前最主流的运行环境。为了让概念更好记我经常用“原版游戏与MOD”来类比。网页就是原版游戏用户脚本就是玩家自制的MOD而Tampermonkey是MOD管理器。原版游戏没有的功能MOD能加原版游戏里看着碍眼的地方MOD能改但MOD改不了服务器数据用户脚本同样不能改变网站后端的逻辑。搞清楚这个边界后面很多问题你就能自己想明白。一段最简单的用户脚本长这样// UserScript // name 示例脚本给网页标题加注释 // namespace https://example.com/ // version 1.0.0 // description 演示油猴脚本的基本结构 // author example // match https://example.com/* // run-at document-end // grant none // /UserScript (function () { use strict; document.title document.title [已注入]; console.log(Tampermonkey脚本运行成功); })();头部那一对注释段叫“元数据块”match声明这个脚本在哪些网址生效document-end表示等页面加载得差不多了再运行grant none表示这个脚本不需要额外权限。这些头信息看起来繁琐但它决定了脚本什么时候跑、在哪儿跑、能干什么。上面的代码不干别的就是把页面标题后面加上“已注入”三个字让你亲眼确认脚本确实被执行了。1.2 油猴插件能帮你做什么又替代不了什么很多新手第一次听到油猴插件第一反应是“只要装上它就什么都能干了”。事情没有这么夸张但不妨碍它确实很能打。它最擅长的是这几类事给网页“洗脸”把广告位、弹窗、干扰元素遮掉或者调整页面的字号、颜色、布局让页面回归内容本身。给功能“加挂件”比如给某个论坛加一个一键回到顶部的按钮给后台管理系统加一个数据导出入口。替手指“偷懒”自动展开全文、自动签到、自动填充表单、自动翻页凡是重复机械的网页操作几乎都能写个脚本代劳。做资源“搬运工”批量下载网页图片、提取在线视频地址、把网页内容导出成Markdown等当然前提是你对这些内容有合法使用权。但它替代不了的事情也很明确它改变不了网站服务器上的数据破解不了付费墙更不应该被用来绕过平台的安全验证和版权限制。工具本身中立关键在使用的人和使用边界。后文推荐脚本时我也会尽量往合规、实用、能解决问题的方向写。1.3 装插件前先确认Chrome版本够不够新在动手之前先确认自己的谷歌浏览器版本别太老。虽然Tampermonkey对版本要求不算苛刻但新版Chrome在扩展机制上不断收紧如果浏览器停留在好几年前的版本可能出现应用商店搜不到、插件运行异常或扩展被自动停用等问题。在地址栏输入chrome://version并回车就能看到当前版本号。以我的经验Chrome 88以上的版本装Tampermonkey基本没问题低于这个版本建议先把浏览器升级到最新稳定版。如果你手头连Chrome都还没装就去官网下载官方稳定版安装包装完再回来继续。顺便说一句Tampermonkey不只是Chrome能用Microsoft Edge、Firefox、Safari都有对应版本同一套用户脚本可以跨浏览器迁移。这篇教程主要围绕Chrome展开Edge用户的操作逻辑几乎完全一致。2. 正式安装的两种路径在线商店安装与离线包加载2.1 在线商店一键安装的正确姿势最省事、最安全的安装方式就是Chrome网上应用店。打开浏览器从右上角“自定义及控制”菜单三个点里找到“扩展程序”再点“访问Chrome网上应用店”或者在地址栏直接输入官方商店地址回车就能进入。在商店搜索框里输入Tampermonkey结果页会出来一堆一定要认准发布者是Tampermonkey的官方项目。点击“添加至Chrome”浏览器会弹出一个权限确认窗口提示这个扩展可以“读取和更改您在访问网站上看到的所有数据”。这个提示看着吓人但它是用户脚本插件的工作前提——它需要往页面里注入代码自然就需要读取页面内容的权限。确认后等待几秒钟浏览器右上角会出现一个半黑底、带白色圆点的图标说明装好了。如果图标没显示点击工具栏上的拼图图标找到Tampermonkey点图钉固定一下图标就会常驻显示。提示搜索结果里混着名字类似但发布者不是官方的扩展遇到“Tampermonkey破解版”“超级油猴加速版”之类的名称果断跳过。扩展一旦装了仿冒品轻则弹广告重则抓取浏览数据。官方标志其实很好认安装量通常在一千万以上发布者名字就叫 Tampermonkey。2.2 离线安装把crx转成zip再加载有些朋友因为种种原因不方便访问在线商店手里只有一个.crx格式的离线安装包。早几年的Chrome允许直接把这个文件拖进扩展管理页安装但主流版本早就收紧了这条路径尤其在新版Chrome上直接拖拽crx基本行不通。我实测过一条相对稳妥的离线加载方法步骤如下从可信来源下载Tampermonkey的crx文件推荐去GitHub上的Tampermonkey官方仓库或者你长期信任的软件站点。把文件名后缀从.crx改成.zip系统会提示更改后可能导致文件不可用确认即可。选中这个zip文件右键解压到一个单独的文件夹里比如D:\tampermonkey-ext。打开浏览器地址栏输入chrome://extensions/并回车。打开页面右上角的“开发者模式”开关。点击左上角“加载已解压的扩展程序”选择刚才解压出来的文件夹。确认文件夹里有manifest.json选中整个文件夹后点“选择文件夹”。加载成功后扩展列表里会出现Tampermonkey。这种方式有两个明显的副作用一是浏览器可能定期弹出“停用开发者模式扩展程序”的提示二是这种加载方式在Chrome眼里属于临时安装部分版本重启后会被自动停用。所以它适合应急真要长期稳定使用还是在线商店安装一劳永逸。2.3 安装后的首次配置图标、语言和更新策略装好后第一次点击Tampermonkey图标会进入欢迎页可以选择界面语言选“简体中文”即可。之后进入仪表盘左侧是“已安装脚本”“设置”“修改日志”等菜单右侧是脚本列表。设置页里有几个选项值得花十秒理解默认值其实就够用但明白含义能避免之后踩坑。我把关键项列在下面设置项默认值含义与建议通用-配置模式初学者想看到更细的参数可以切到“高级”普通用户保持默认更新-更新检查周期每周脚本作者修复Bug和适配网站后需要及时同步周期太短会频繁检查太长容易错过更新默认值刚刚好通用-文件访问权限询问脚本向其他网站请求数据时需要用到建议保留“询问”逐个放行更新-严格HTTPS检查开启默认只在HTTPS页面运行脚本避免脚本在明文页面里暴露建议保持开启这些配置现在不必急着改等你遇到“脚本为什么没生效”的时候再回来调整思路会更清晰。3. 找到并安装用户脚本油猴插件的灵魂环节3.1 脚本来源哪个脚本库靠谱怎么判断好坏Tampermonkey只是个壳真正的能力来自用户脚本。那脚本从哪找目前最主流、对新手最友好的脚本平台是GreasyFork上面有大量由不同作者维护的用户脚本安装量、评分、讨论区一应俱全很适合搜索和发现新脚本。GitHub上也有很多脚本仓库但它是面向开发者的需要自己看README和releases门槛略高。判断一个脚本靠不靠谱我一般看四个指标按重要程度排序安装量过万基本说明被很多人验证过踩坑概率低只有几个安装量的脚本要格外谨慎。最近更新日期脚本本质上是脆弱的网站前端只要改版脚本就可能失效。一年没更新的脚本大概率已经不适应当前页面。代码是否可读打开源码看一眼如果满屏都是压缩乱码、混淆字符或者有从远程服务器拉额外代码的逻辑即使安装量再高我也敬而远之。权限是否匹配一个只改页面背景的脚本却声明要跨域访问所有网站这本身就值得怀疑。按这四个标准筛下来能过滤掉大多数不靠谱的选项。3.2 安装一个脚本的完整流程以GreasyFork为例找到目标脚本后页面右上角一般有个绿色的“Install this script”按钮。点击后Tampermonkey会拦截这个请求自动打开一个新的标签页显示安装确认界面。在这个确认页里信息密度其实很高别急着点“安装”。优先看三项名称与版本确认你要装的确实是这个脚本而不是同名的其他东西。匹配站点脚本只会在列出的网站生效如果“匹配站点”写着*://*表示所有网站都运行需要提高警惕。权限安装按钮旁边可能提示“此脚本请求访问多个域”点进去能看到具体跨域请求的目标确认这些域名和脚本功能匹配。确认无误后点“安装”脚本状态变为“已启用”并出现在仪表盘的脚本列表里。接下来你打开匹配的网站刷新一下页面脚本就生效了。3.3 在Tampermonkey里亲手写一个脚本理解运行机制光看别人写的脚本始终隔了一层。如果你愿意花五分钟我建议你亲手在Tampermonkey里新建一个最简脚本体验“写代码→注入页面→生效”这条完整链路。在仪表盘点击“添加新脚本”会打开一个内置代码编辑器里面已经生成了一段模板。把内容替换成下面这段// UserScript // name 我的第一个脚本 // namespace http://tampermonkey.net/ // version 0.1 // description 试试油猴的基础玩法 // author you // match https://www.baidu.com/* // grant none // /UserScript (function () { use strict; const div document.createElement(div); div.textContent 油猴脚本注入测试; div.style.cssText position:fixed;bottom:20px;right:20px;background:#333;color:#fff;padding:10px 16px;border-radius:8px;z-index:99999;; document.body.appendChild(div); })();保存CtrlS后打开百度首页并刷新右下角会冒出一个浮动的小提示框那就是脚本注入的结果。看懂这个例子你再回头去看别人写的脚本就能大概猜出它们是怎么把功能“插”进网页里的了。右上角出现浮动元素也是很多用户脚本最常用的交互形式因为实现简单、不破坏原页面结构。但反过来也有不良脚本用同样方式弹广告——这就是我坚持“装脚本前先扫一眼代码”的原因。3.4 脚本管理启用、停用、编辑和备份脚本一旦多起来管理就成了刚需。Tampermonkey的仪表盘里每个脚本右侧都有启用/停用开关点击齿轮或代码图标可以编辑源码还有删除操作。对于暂时用不上的脚本停用比删除更稳妥万一过几天又需要一键就能恢复。脚本更新策略也可以在这里统一管理默认每星期检查一次更新。遇到脚本报错先到脚本所在页面看看作者是否发布了新版本或者手动执行一次“检查更新”很多问题其实早被作者修掉了。备份这件事很少被新手放在心上但它非常重要。更换电脑、重装系统之前在设置里找到“实用工具”→“导出”可以把所有已安装脚本打包成一个zip文件新环境里装好Tampermonkey后用“导入”功能选中这个zip几秒钟全部恢复。我吃过没备份的亏重装完浏览器后花了两个多小时重新找脚本、调设置从那以后每隔几个月就导出一次。4. 值得第一时间装上的几类脚本附实测感受4.1 网页美化与阅读体验类这类脚本适合觉得现在网页“刺眼”“太满”的人。最常见的是给网页加全局深色模式和普通深色模式浏览器扩展不同用户脚本可以更精细地调整对比度、亮度甚至针对特定站点单独配色。还有一类是清理型脚本把搜索结果页或文章页里的广告位、无关推荐模块隐藏掉这类脚本装完立竿见影页面清爽程度直接上一个档次。实测下来清理干扰类脚本见效最快但有一个副作用网站改版后脚本没来得及更新页面可能出现大段空白或样式错乱。遇到这种情况不用慌去脚本页面看有没有新版本或者临时停用脚本刷新页面通常能很快确定是不是脚本引起的。4.2 效率工具类右键增强、翻译和自动展开效率类脚本是我日常用得最多的一类。比如给网页增加自定义右键菜单把“用搜索引擎搜索选中文字”“复制为纯文本”“截图并编辑”这些高频操作集中在菜单里再比如让某些默认折叠的页面内容自动展开省去一次次点击“查看更多”的动作。对于经常查资料、写文档的人来说这类脚本提升效率非常明显。翻译增强类脚本也值得一试。它们可以调用多种翻译引擎把选中文字在页面内悬浮显示省去来回切换翻译网站的步骤。不过这里要说清楚翻译脚本起的是辅助作用如果网站本身提供了排版良好的译文没必要额外折腾脚本。4.3 下载辅助类网页图片采集与视频提取下载辅助类脚本对很多人来说是刚需。举两个典型场景一是设计师、运营朋友需要批量下载素材网站上的公开图片逐个右键保存非常痛苦图片采集脚本可以一键抓取页面内所有图片并打包下载二是在线视频比如开放式公开课、自己后台里的视频等没有提供下载按钮视频提取脚本能嗅探到媒体文件地址方便离线观看。这里必须提醒下载辅助脚本的能力本质是“把页面里本来就有的资源指给你”它不等于你可以无视版权地去扒任何内容。自己拍的视频、平台明确允许下载的公开资源用起来很舒服拿它去抓别人付费内容既违背脚本作者的初衷也容易给自己惹麻烦。使用前先把授权边界想清楚。4.4 我装了以后又卸掉的几类脚本讲完推荐的也说点反面教材。我试过几款“资源聚合导航”类脚本装上后地址栏多了一堆自动跳转规则网页底部时不时弹出推荐内容明显带着推广性质。还试过功能大而全的“百宝箱”脚本结果和另一个脚本定位重叠两个脚本抢着改同一块页面元素直接把页面排版弄崩了。从那以后我给自己定了规矩同类功能只留一个脚本宁缺毋滥。5. 脚本不生效、插件被停用我的排查链路和解决思路5.1 先把问题分层是插件问题还是脚本问题“我明明装好了脚本网页怎么一点变化都没有”这是被问得最多的问题。我的排查顺序永远是先分层别一上来就怀疑脚本坏了。第一步看Tampermonkey图标是否正常显示。如果图标灰掉或者整个插件从工具栏消失那问题多半出在插件本身而不是脚本。第二步在管理面板里找到目标脚本确认开关是“已启用”。很多人测试时不小心点到了开关把脚本停掉了。第三步看脚本的匹配站点是否覆盖当前网址。脚本写的匹配规则是https://example.com/*你却在另一个域名下测试当然不会生效。老规矩直接看脚本描述里的适用网站。第四步刷新页面。脚本通常只在页面加载时注入如果页面在脚本安装之前就开着刷新一次让它重新加载即可。我把常见现象和处理思路整理成一张表方便对号入座现象可能原因对策图标正常、脚本已启用、页面没变化脚本匹配地址不对检查match或换一个覆盖范围更广的脚本图标灰掉、脚本列表为空插件未真正加载重新加载插件或确认开发者模式扩展状态之前能用某天突然失效网站改版、脚本更新滞后去脚本页面看是否有新版本或临时停用以确认某个页面报错其他页面正常脚本与特定页面结构冲突在该页临时停用脚本排除干扰项5.2 新版Chrome的“开发者模式扩展程序”自动停用问题如果你用上一章第2.2节的离线方式安装Tampermonkey在较新版本的Chrome上大概率会撞上一种特别常见的现象今天还用得好好的第二天重启浏览器发现插件被自动停用了。这不是你操作失误也不是电脑中毒而是Chrome在刻意收紧“开发者模式”下加载扩展的权限。Chrome为什么要这么做因为开发者模式加载扩展的门槛低容易被滥用所以主版本更新后对没有上架商店的扩展采取了更激进的管理策略。想彻底摆脱这个问题眼下最有效的办法只有一个回到在线商店安装正式版。离线安装适合临时应急真要长期稳定使用就别嫌麻烦把正式版装上。5.3 用控制台和Tampermonkey面板排查脚本报错如果基础检查全部正常但脚本就是不干活这时候可以看浏览器控制台。在目标网页上按F12打开开发者工具切到Console标签页然后刷新页面。脚本运行报错时这里会显示红色报错信息展开后能看到具体是哪一行代码出了问题。报错信息里的来源通常带有脚本名或userscript.html字样非常容易辨认。Tampermonkey自己的面板也提供排查线索。在“已安装脚本”里打开脚本的编辑界面右下角有一个“日志”区域会记录脚本的启动情况。开启调试日志后还能跟踪脚本在每个匹配页面的执行情况。另外脚本涉及跨域请求时经常会出现“被CORS策略拦截”的报错。这是浏览器安全机制在起作用靠关闭安全开关是下策正确做法是检查脚本声明的允许域名和实际请求目标是否一致或者改用后端代理的方式去请求而不是动浏览器层面的安全设置。6. 玩脚本的安全底线一次差点翻车的教训6.1 陌生脚本的三大危险信号用户脚本的能力范围比普通浏览器扩展还要大因为它运行在你访问的每一个匹配页面里可以读取页面内容、发送请求、甚至修改表单。我前阵子差点装了一个来路不明的脚本事后越想越后怕。那个脚本页面只有一个下载按钮没有作者信息、没有更新日志打开源码一看一大段压缩过的代码还暗藏远程拉取指令。从那以后我把危险信号总结成三条遇到任何一条就果断放弃源码混淆严重、无法阅读但没有任何说明文字。代码里存在向陌生域名发起请求的逻辑尤其是动态拼接地址的请求。脚本声明要读取或上传cookie、localStorage等敏感信息但功能和这些权限完全对不上。6.2 别把所有权限都交给脚本Tampermonkey在安装脚本时会展示权限信息有些新手为了省事直接点“允许”这是最要不得的习惯。权限的本质是信任边界给得越宽风险就越大。具体操作上我的建议是在Tampermonkey设置里把“文件访问权限”设为“询问”而不是“一律允许”。看到“所有网站”范围的请求时先想想脚本有没有必要这样做。一个只作用于A网站的脚本没理由去读B网站的数据。涉及账号登录、支付、个人隐私的高危页面比如银行、支付平台、邮箱不要在上面跑无关脚本。我是直接把核心站点放进脚本排除列表的这样即使某个脚本失控也不会碰到我的敏感数据。6.3 我的脚本管理和清理习惯玩脚本玩了几年我从“什么都想装”变成了“尽量少装”。现在的习惯是每个季度打开一次Tampermonkey仪表盘停用超过三个月没碰的脚本定期检查更新重要场景只留精简可靠的脚本。另外脚本不是越多越好。装十几个脚本确实能带来“功能爆炸”的快感但脚本之间互相干扰、拖慢首屏加载、增加浏览器内存占用的问题也会跟着来。装之前先问自己一句这个功能我真的每天都要用吗如果不是它就没资格常驻在我的浏览器里。最后分享一个最近养成的习惯每次给朋友推荐油猴插件我都会让他们先装一个浅显的脚本体验一下“注入”到底是怎么回事再放手去装自己真正需要的。这样既降低了试错成本也让他们对“用户脚本能做什么、不能做什么”心里有数。工具这种东西用得明白才有价值别让一个本该提升效率的东西变成浏览器的负担。
返回列表