No Comments

油猴脚本开发教程

什么是油猴脚本

Tampermonkey，又称 Greasemonkey 油猴脚本，是一款免费的浏览器扩展，可用于管理用户脚本，它本质上是对浏览器接口的二次封装

油猴脚本可用于更改页面布局样式、完成页面自动化、去广告、下载影视等功能，适用于主流的浏览器

https://www.tampermonkey.net

油猴脚本执行原理

油猴脚本的基本格式

// ==UserScript==
// @name         新脚本
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  在此处填写脚本的描述信息
// @author       你的名字
// @match        https://*
// @grant        none
// ==/UserScript==
(function() {
    'use strict';
    // 这里是编写代码的区域
})();

为了让脚本精准地在我们期望的网页上运行，并且具备更强大的功能，就需要合理配置运行环境，这其中最重要的两个配置就是 @match 和 @require 标签的使用。

  • @match：正如前文所提到的，它通过特定的匹配规则来决定脚本的生效网页。除了前面示例中的通配符用法，还可以有更精准的设置。
  • @require：当我们编写的脚本功能较为复杂，需要借助一些成熟的 JavaScript 库来提升开发效率时，就需要使用 @require 标签引入外部库。
  • @grant：用于指定脚本运行所需的权限，none 表示不使用沙箱环境，脚本直接运行在网页环境中，但这样可能无法使用一些油猴扩展提供的特殊 API，若需要使用特定 API，需按照要求更改此权限设置。

元数据(开头文件中的注释)

// ==UserScript==
// @name 脚本元数据
// ==/UserScript==

常见元数据

@name 脚本的名称。该项将显示在页面的标题以及链接内容，必填项。
@description 脚本功能的描述，显示在脚本标题下面，必填项。
@namespace 与 @name 这两个属性被作为脚本的唯一标识符，用户脚本管理器根据它们来判断一个脚本是否已安装。Greasy Fork 也需要这些属性，若用户在更新脚本时改变了两者中的任意一项，将发出警告。
@version 脚本特定版本的标识符，请以 Mozilla 版本格式 为准，版本号会显示在脚本的信息页面上。Greasy Fork 要求填写该属性，并会在版本号减少或脚本代码更改时未增加版本号时发出警告。
@include, @exclude, @match 描述脚本会在哪些网站上运行。该列表会被解析和展示到脚本的简介页面，并用于脚本的分类。每个脚本须有至少一个 @match 或 @include。
@require 引入外部脚本到用户脚本。
@resource 引入外部资源（如 JavaScript、CSS、图像等）到脚本。
@updateURL, @installURL, @downloadURL 告知用户脚本管理器应该在哪个地址获取脚本更新。
@supportURL 用户获得脚本支持的链接（例如，一个错误跟踪器、论坛或电子邮件地址），该支持链接将显示于脚本的反馈页面。
@compatible, @incompatible 标记此脚本与某个浏览器兼容/不兼容，兼容/不兼容性信息将显示在脚本的简介页面上。
@run-at 指定脚本的运行时机

特殊元数据
@connect 声明 GM_xmlhttpRequest API可访问的域(跨域), 必须指定才能正常请求
@grant 见"常见API"

常见API(见文档)

@grant 元数据块命令控制脚本使用哪些特殊 API （如果有），如果未指定任何值，则默认 none。如果需要使用多个API, 需要全部列出来。

在使用这些API前, 其实有很多API浏览器已经支持了, 建议使用浏览器API而非油猴API:
GM_log(message): 在浏览器的控制台打印日志信息。
GM_xmlhttpRequest(details)：突破跨域请求限制(@connect)，类似ajax。
GM_addStyle(css)：向页面添加自定义的 CSS 样式。
GM_openInTab(url, options): 该 API 可用于打开一个新的标签页面。

GM_xmlhttpRequest({
  method: "GET",
  url: "https://example.com/",
  headers: {
    "Content-Type": "application/json"
  },
  onload: function(response) {
    console.log(response.responseText);
  }
});

const r = await GM.xmlHttpRequest({ url: "https://example.com/" }).catch(e => console.error(e));
console.log(r.responseText);

开发示例(手动采集企业详情)

扩展阅读

官方文档

最后更新于  2025-04-10 14:08:25  并被添加「Tampermonkey 油猴 篡改猴」标签，已有 110 位童鞋阅读过。

本站使用「署名 4.0 国际」创作共享协议，可自由转载、引用，但需署名作者且注明文章出处

此处评论已关闭