【自动化】初见 - 最强浏览器插件 《油猴Tampermonkey》 开发和发布

🛫 导读

需求

Tampermonkey 是一款免费的浏览器扩展和最为流行的用户脚本管理器，它适用于 Chrome, Microsoft Edge, Safari, Opera Next, 和 Firefox。
油猴脚本（Tampermonkey）是一个非常流行的浏览器扩展，它可以运行由广大社区编写的扩展脚本，来实现各式各样的功能，常见的去广告、修改样式文件、甚至是下载视频。今天我们就来看看如何编写自己的油猴脚本。当然为了运行油猴脚本，你应该在浏览器中安装油猴插件。

开发环境

	版本号	描述
文章日期	2022-12-11

1️⃣ 油猴插件基本使用

打开油猴官网（https://greasyfork.org/zh-CN），可以看到使用方法。

安装油猴插件

不同平台，不同浏览器，都有不同的地址，我们使用的是 桌面端 > Chrome。

打开应用商店，点击《添加至Chrome》，稍等片刻即可。

安装用户脚本

油猴脚本地址 https://greasyfork.org/zh-CN/scripts，查找您想尝试的用户脚本。
我们以脚本《HTML5视频播放器增强脚本》 https://greasyfork.org/zh-CN/scripts/381682-html5%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8%E5%A2%9E%E5%BC%BA%E8%84%9A%E6%9C%AC为例，进行讲解。

1. 搜索speed，可以查到相关脚本
   

2. 点击链接，进入详情页面，点击安装此脚本。
   

3. 稍等片刻，会进入油猴插件页面。点击安装或者重新安装即可。
   

使用用户脚本

打开任意带有h5播放器的页面，点击油猴插件，可以看到脚本加载运行了。

不同的脚本使用都是不一样的，本脚本使用的是快捷键进行操作，可以打开快捷键菜单，查看对应的操作。

接下来，我们在播放器页面，按C即可加速播放视频了。

2️⃣ 脚本开发-自定义baidu搜索框

作为一个程序猿，肯定不能放过这么个神器了，现在就尝个鲜：自定义baidu搜索框。

新建脚本

点击油猴插件，选择添加新脚本...菜单：

修改元数据

参考官方开发文档：https://www.tampermonkey.net/documentation.php，我们对其中部分元数据其做简单介绍。

// ==UserScript==
// @name         这里是你的编写的油猴脚本的名字
// @namespace    这个是命名空间；用来区分名称相同但是作者不同的用户脚本，一般都是写作者的个人网址，没有也可以写你的博客地址
// @version      0.1  这个是版本号
// @description  这个是功能描述，描述你的这个脚本是用来干嘛的
// @author       这个是作者的名字，比如我：mukes
// @match        这个是该脚本匹配的网址，支持通配符匹配
// @include		 这个也是该脚本匹配的网址，支持通配符匹配
// @exclude		 这个和 iclude 配合使用，排除匹配到的网址，优先于 include
// @grant        none 
// ==/UserScript==

我们对脚本元数据进行如下修改：

// ==UserScript==
// @name         自定义百度搜索框
// @namespace    http://l0l.fun/
// @version      0.2
// @description  自定义百度搜索框!第一个
// @author       yeahmao
// @match        https://www.baidu.com
// @icon         https://www.google.com/s2/favicons?sz=64&domain=baidu.com
// @grant        none
// ==/UserScript==

可在脚本列表中看到对应效果。

编写脚本

脚本原理：修改搜索框的背景图片、高度，就可以了。

// ==UserScript==
// @name         自定义百度搜索框
// @namespace    http://l0l.fun/
// @version      0.2
// @description  自定义百度搜索框!第一个
// @author       yeahmao
// @match        https://*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=baidu.com
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
    let el = document.querySelector('#kw')
    if (el) {
        el.style.backgroundImage='url(https://t7.baidu.com/it/u=1415984692,3889465312&fm=193&f=GIF)'
        el.style.height='80px'
    }
})();

3️⃣ 脚本发布

油猴脚本可以上传到多个不同的平台：https://greasyfork.org/、https://openuserjs.org/等。
openuserjs网速很慢，而且登录认证需要对国内不友好，建议使用greasyfork进行脚本发布。

注册账号

发布脚本，首先要注册一个油猴账号：https://greasyfork.org/zh-CN/users/sign_up

发布脚本

登录后，打开控制台页面，点击《发布你编写的脚本》。

不过对于新用户，会有限制，提示新用户无法进行发布。

这是因为未进行邮箱或者三方登录的确认。打开页面《https://greasyfork.org/zh-CN/script_versions/new?language=css》，进行邮箱确认。

现在，我们将之前写的脚本《【自动化】【微信公众号】油猴 - 自动发布文章https://blog.csdn.net/kinghzking/article/details/128272605》，添加到代码段，其他使用默认选项即可。

🛬 文章小结

油猴虽好，不要乱用。

• 不要随意下载不熟悉的脚本，它可能是恶意脚本。
• 尽量关闭不常用的脚本，每打开一个网页，都会导致网页加载一个脚本，控制脚本的使用能增强浏览器性能。
• 控制脚本访问访问，有些网站会与脚本冲突，控制脚本访问网站，可以保障网站的正常运行。
• 尽量删除不常用的脚本，之前下载过一个脚本，一开始挺好，忽然发现浏览器莫名的打开一些网站，最后发现一款一年多没用过的软件，果断删除。

📖 参考资料

• 油猴官网： https://greasyfork.org/zh-CN
• 油猴脚本地址： https://greasyfork.org/zh-CN/scripts
• 官方开发文档：https://www.tampermonkey.net/documentation.php
• 强大的油猴Tampermonkey脚本开发环境搭建：https://www.luoxiao123.cn/tampermonkey-script-environment-construction.html

**ps：**文章中内容仅用于技术交流，请勿用于违规违法行为。