油猴脚本开发

961 阅读2分钟

油猴官方文档:www.tampermonkey.net/documentati…

油猴内置对象的使用方法:

@match:

脚本能运行在哪些网站上,可以设置多个,规则是 Chrome Extensions 的规则

mathc基础规则:

<url-pattern> := <scheme>://<host><path>
<scheme> := '*' | 'http' | 'https' | 'file' | 'ftp' | 'urn'
<host> := '*' | '*.' <any char except '/' and '*'>+
<path> := '/' <any chars>

@grant:

将GM_* 函数、unsafeWindow 对象和一些强大的窗口函数列入白名单

@require

引入第三方js库

开发环境搭建

  1. 初始化一个npm包安装环境
npm init

package.json内容自己改了一下:

修改了代码后直接运行 :npm run publish提交代码到git

{
  "name": "tampermonkey",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "publish": "git add .  && git commit -m 'temp' && git  push",
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.18.1",
    "open": "^8.4.0"
  }
}

  1. 在浏览器油猴插件中新建一个脚本,内容不用管,直接保存,然后打开编辑-》设置,把之前得的访问脚本的url填到更新地址,保存。

  2. 在油猴插件列表点击更新按钮。

代码上传到gitlab后,在文件详情页点击“打开原始文件”得到一个能直接访问文件内容的url,这个url可用于油猴脚本的安装,更新。

image.png

github中是“Raw”按钮

image.png

  1. 代码结构

主脚本:油猴插件程序

其他每个文件都是一个函数,在主程序中调用

image.png

案例Demo:

主脚本

// ==UserScript==
// @name         bet365-数据爬取集合
// @namespace    https://www.388.com/
// @version      1.91
// @description  获取bet365 多种比赛数据
// @author       hanshuqiang
// @match        http://*/dota2*
// @match        http://*/LOL*
// @match        http://*/csgo*
// @match        https://www.388.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=bet365.com
// @grant        GM_xmlhttpRequest //可跨域发起网络请求,要配合 @connect *s使用
// @grant          GM_setClipboard //设置剪切板
// @grant          GM_addStyle
// @grant          GM_setValue  //设置一个全局key-value
// @grant          GM_getValue
// @grant          GM_deleteValue
// @grant          GM_registerMenuCommand //创建一个菜单
// @connect      *
// @require      https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.4/moment.min.js
// @require      http://49.22.15.18:1280/hanshuqiang/bet365/-/raw/main/tampermonkey/src/utils.js
// @require      http://49.22.15.18:1280/hanshuqiang/bet365/-/raw/main/tampermonkey/src/CSGO.js
// @require      http://49.22.15.18:1280/hanshuqiang/bet365/-/raw/main/tampermonkey/src/%E8%8B%B1%E9%9B%84%E8%81%94%E7%9B%9F.js
// @require      http://49.22.15.18:1280/hanshuqiang/bet365/-/raw/main/tampermonkey/src/DOTA2.JS
// @updateURL    http://49.22.15.18:1280/hanshuqiang/bet365/-/raw/main/tampermonkey/src/主脚本.js
// @downloadURL  http://49.22.15.18:1280/hanshuqiang/bet365/-/raw/main/tampermonkey/src/主脚本.js
// ==/UserScript== 

(function () {
    'use strict';

    //如果不是比赛详情页,不执行
    if (location.href.indexOf('https://www.388.com/#/IP') == -1 && location.href.indexOf('192.168') == -1) {
        return
    }
    console.log('初始化主脚本...');

    let Dota2ApiConfirm = () => {
        let defauleV = GM_getValue("DOTA2_API") || 'http://127.0.0.1:7001/add?url=http://45.67.123.22:8099/dota2'
        let apiUrl = prompt("DOTA2上报API:", defauleV);
        GM_setValue("DOTA2_API", apiUrl);
    }
    let LoLApiConfirm = () => {
        let defauleV = GM_getValue("LOL_API") || 'http://127.0.0.1:7001/add?url=http://192.168.110.16:6202/v1/lol/report'
        let apiUrl = prompt("LOL上报API:", defauleV);
        GM_setValue("LOL_API", apiUrl);
    }
    let CSGOApiConfirm = () => {
        let defauleV = GM_getValue("CSGO_API") || 'http://127.0.0.1:7001/add?url=http://192.168.110.201:6202/v1/esport/csgo/match/data'
        let apiUrl = prompt("CSGO上报API:", defauleV);
        GM_setValue("CSGO_API", apiUrl);
    }
    GM_registerMenuCommand("DOTA2-API", Dota2ApiConfirm, "D");
    GM_registerMenuCommand("LOL-API", LoLApiConfirm, "L");
    GM_registerMenuCommand("CS:GO-API", CSGOApiConfirm, "C");
    let setInt = setInterval(() => {
        let sj = document.querySelector('.ipe-EventHeader_BreadcrumbText ')
        if (sj) {
            clearInterval(setInt)
            if (sj && sj.innerText && sj.innerText.indexOf('CS:GO') != -1) {
                CSGO()
            }
            if (sj && sj.innerText && sj.innerText.indexOf('反恐精英') != -1) {
                CSGO()
            }
            if (sj && sj.innerText && sj.innerText.indexOf('英雄') != -1) {
                LOL()
            }
            if (sj && sj.innerText && sj.innerText.indexOf('LOL') != -1) {
                LOL()
            }
            if (sj && sj.innerText && sj.innerText.indexOf('DOTA2') != -1) {
                DOTA2()
            }
        }
    }, 1000);
})()

DOTA2.JS

/**
 * DOTA2
 */
const DOTA2 = () => {
    console.log('初始化DOTA2');

    /**上报接口 */
    const global_post_url = GM_getValue("DOTA2_API")

    if (!global_post_url) {
        console.error('请在设置上报API')
        return
    }
    ....
 
}