Greasy Fork 支持简体中文。

22/7表情包

在B站中增加22/7表情包 Forked from https://github.com/AS042971/bilibili-bobo

// ==UserScript==
// @name         22/7表情包
// @license      BSD-3
// @version      0.0.2
// @description  在B站中增加22/7表情包 Forked from https://github.com/AS042971/bilibili-bobo
// @author       Sora-Ayano
// @match        https://*.bilibili.com/*
// @exclude      https://live.bilibili.com/*
// @icon         https://i1.hdslb.com/bfs/archive/a0f5e1197e5381007cdd2e8dfc3a0ca4215e03c8.png
// @run-at       document-start
// @grant        unsafeWindow
// @grant        GM_getValue
// @grant        GM_setValue
// @grant        GM_xmlhttpRequest
// @connect      git.asf.ink
// @connect      gitee.com
// @connect      api.bilibili.com
// @connect      i0.hdslb.com
// @namespace https://greasyfork.org/users/1096044
// ==/UserScript==

(async function() {
    'use strict';
    // 使用沙盒模式只能自己穿透注入xhook,否则xhook无法初始化
    let xhookLoad = new Promise(resolve => {
        if (!unsafeWindow.xhook) {
            const xhookScriptEl = unsafeWindow.document.createElement('script');
            xhookScriptEl.type = 'text/javascript';
            xhookScriptEl.src = 'https://unpkg.com/[email protected]/dist/xhook.min.js';

            // script 标签加载完成后添加钩子
            xhookScriptEl.onload = () => {
                resolve();
            }
            unsafeWindow.document.head.appendChild(xhookScriptEl);
        } else {
            // 如果其他插件注入了脚本就不用自己插入了
            resolve();
        }
    });

    const animateArr = GM_getValue('like_icons', []);
    if (animateArr.length > 0) {
      let times = 0;
      let timer = setInterval(() => {
        let data = unsafeWindow.__INITIAL_STATE__;
        if (data || times > 50) {
            if (data && !data.videoData.user_garb.url_image_ani_cut) data.videoData.user_garb.url_image_ani_cut = animateArr[0];
            clearInterval(timer);
        }
        times++;
      }, 100);
    }

    // 下载url中的表情包并解析
    const defaultURLs = [
        "https://gitee.com/kafuuchino12138/emotes227/raw/master/emotes.json"
    ]
    let resolveEmoteURL = function(url){
        return new Promise(resolve => {
            GM_xmlhttpRequest({
                url: url,
                method : "GET",
                onload : function(data){
                    try {
                        let json = JSON.parse(data.responseText);
                        if (json.data?.packages) {
                            resolve(json.data.packages)
                        } else if ('emote' in json.data) {
                            resolve([json.data])
                        } else {
                            resolve([]);
                        }
                    } catch (error) {
                        resolve([]);
                    }
                },
                onerror : function(err) {
                    resolve([]);
                }
            });
        });
    };
    let getReplyItem = function(resolved_emote) {
        return {
            "id": resolved_emote.id,
            "package_id": resolved_emote.package_id,
            "state": 0,
            "type": 3,
            "attr": 0,
            "text": resolved_emote.text,
            "url": resolved_emote.url,
            "meta": {
                "size": 2
            },
            "mtime": resolved_emote.mtime,
            "jump_title": resolved_emote.meta.alias
        }
    }
    let refreshEmote = async function(urls) {
        urls = urls.concat(defaultURLs);
        let resolved_emote_packs = [];
        for (let i in urls) {
            if (urls[i].trim()) {
                let packs = await resolveEmoteURL(urls[i]);
                resolved_emote_packs = resolved_emote_packs.concat(packs);
            }
        }
        let emote_dict = {}
        let chn_emote_dict = {}
        resolved_emote_packs.forEach(function (pack) {
            pack.emote.forEach(function(emote) {
                let key = emote.text;
                let chn_key = key.replace('[','【').replace(']','】');
                let reply_item = getReplyItem(emote);
                emote_dict[key] = reply_item;
                chn_emote_dict[chn_key] = reply_item;
            })
        });
        GM_setValue('resolved_emote_packs', resolved_emote_packs);
        GM_setValue('emote_dict', emote_dict);
        GM_setValue('chn_emote_dict', chn_emote_dict);
    }

    // 订阅(已删)
    let createEmotePanel = function() {
    }
    let createEmoteBtn = function() {
        // 将配置按钮添加到头像弹出面板
        let linkItem = unsafeWindow.document.querySelector('.links-item');
        if (linkItem && !linkItem.classList.contains('contains-setting')){
            const settingBtnEl = unsafeWindow.document.createElement("div");

            settingBtnEl.innerHTML = `
<div class="single-link-item">
  <div class="link-title"><svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"
      class="link-icon">
      <rect opacity="0.01" width="18" height="18" fill="#C4C4C4"></rect>
      <path fill-rule="evenodd" clip-rule="evenodd"
        d="M12.3995 0.75H4.04147C2.91872 0.75 1.99997 1.6695 1.99997 2.79225V15.2078C1.99997 16.3305 2.91872 17.25 4.04147 17.25H12.5067C14.5655 17.25 16.25 15.5655 16.25 13.5068V4.6005C16.25 2.48325 14.5167 0.75 12.3995 0.75ZM12.3995 2.25469C13.6962 2.25469 14.75 3.30844 14.75 4.60519V13.5114C14.75 14.7482 13.7435 15.7547 12.5067 15.7547H4.04146C3.74821 15.7547 3.49996 15.5064 3.49996 15.2124V2.79694C3.49996 2.50294 3.74821 2.25469 4.04146 2.25469H12.3995Z"
        fill="var(--text2)"></path>
      <path fill-rule="evenodd" clip-rule="evenodd"
        d="M9.02925 0.75H5.4705C5.21025 0.75 4.9995 0.98475 4.9995 1.27425V7.5435C4.9995 7.842 5.21925 8.0685 5.46975 8.0685C5.5185 8.0685 5.5695 8.0595 5.61975 8.04075L7.101 7.49025C7.149 7.47225 7.2 7.46325 7.2495 7.46325C7.29975 7.46325 7.35075 7.47225 7.39875 7.49025L8.88 8.04075C8.93025 8.0595 8.98125 8.0685 9.03 8.0685C9.27975 8.0685 9.4995 7.842 9.4995 7.5435V1.27425C9.4995 0.98475 9.2895 0.75 9.02925 0.75ZM7.99946 2.25469V6.11794L7.92071 6.08869C7.70471 6.00919 7.47971 5.96794 7.24946 5.96794C7.01996 5.96794 6.79496 6.00919 6.57896 6.08869L6.49946 6.11794V2.25469H7.99946Z"
        fill="var(--text2)"></path>
    </svg><span>附加表情</span></div><svg width="10" height="10" viewBox="0 0 9 9" fill="none"
    xmlns="http://www.w3.org/2000/svg" class="link-icon--right">
    <path fill-rule="evenodd" clip-rule="evenodd"
      d="M7.50588 3.40623C7.40825 3.3086 7.24996 3.3086 7.15232 3.40623L4.41244 6.14612L1.67255 3.40623C1.57491 3.3086 1.41662 3.3086 1.31899 3.40623C1.22136 3.50386 1.22136 3.66215 1.31899 3.75978L4.11781 6.5586C4.28053 6.72132 4.54434 6.72132 4.70706 6.5586L7.50588 3.75978C7.60351 3.66215 7.60351 3.50386 7.50588 3.40623Z"
      fill="currentColor"></path>
    <path
      d="M7.15232 3.40623L7.50588 3.75978L7.50588 3.75978L7.15232 3.40623ZM7.50588 3.40623L7.15232 3.75978L7.15233 3.75978L7.50588 3.40623ZM4.41244 6.14612L4.05888 6.49967C4.15265 6.59344 4.27983 6.64612 4.41244 6.64612C4.54504 6.64612 4.67222 6.59344 4.76599 6.49967L4.41244 6.14612ZM1.67255 3.40623L2.0261 3.05268L2.0261 3.05268L1.67255 3.40623ZM1.31899 3.40623L0.965439 3.05268L0.965439 3.05268L1.31899 3.40623ZM1.31899 3.75978L1.67255 3.40623V3.40623L1.31899 3.75978ZM4.11781 6.5586L3.76425 6.91215L4.11781 6.5586ZM4.70706 6.5586L4.35351 6.20505L4.70706 6.5586ZM7.50588 3.75978L7.15233 3.40623L7.15232 3.40623L7.50588 3.75978ZM7.50588 3.75978C7.40825 3.85742 7.24996 3.85742 7.15232 3.75978L7.85943 3.05268C7.56654 2.75978 7.09166 2.75978 6.79877 3.05268L7.50588 3.75978ZM4.76599 6.49967L7.50588 3.75978L6.79877 3.05268L4.05888 5.79257L4.76599 6.49967ZM1.31899 3.75978L4.05888 6.49967L4.76599 5.79257L2.0261 3.05268L1.31899 3.75978ZM1.67254 3.75979C1.57491 3.85742 1.41662 3.85742 1.31899 3.75979L2.0261 3.05268C1.73321 2.75978 1.25833 2.75978 0.965439 3.05268L1.67254 3.75979ZM1.67255 3.40623C1.77018 3.50386 1.77018 3.66215 1.67255 3.75978L0.965439 3.05268C0.672546 3.34557 0.672546 3.82044 0.965439 4.11334L1.67255 3.40623ZM4.47136 6.20505L1.67255 3.40623L0.965439 4.11334L3.76425 6.91215L4.47136 6.20505ZM4.35351 6.20505C4.38605 6.1725 4.43882 6.1725 4.47136 6.20505L3.76425 6.91215C4.12223 7.27013 4.70264 7.27013 5.06062 6.91215L4.35351 6.20505ZM7.15232 3.40623L4.35351 6.20505L5.06062 6.91215L7.85943 4.11334L7.15232 3.40623ZM7.15233 3.75978C7.05469 3.66215 7.05469 3.50386 7.15233 3.40623L7.85943 4.11334C8.15233 3.82045 8.15233 3.34557 7.85943 3.05268L7.15233 3.75978Z"
      fill="currentColor"></path>
  </svg>
</div>
      `;
            settingBtnEl.addEventListener('click', () => {
                createEmotePanel();
            });
            linkItem.appendChild(settingBtnEl);
            linkItem.classList.add('contains-setting');
        }
    }

    // 注入动态和评论
    let injectDynamicItem = function(item, emote_dict, chn_emote_dict) {
        const animateArr = GM_getValue('like_icons', []);
        if (animateArr.length > 0 && item?.basic?.like_icon && !item.basic.like_icon.action_url) {
            item.basic.like_icon.action_url = animateArr[0];
        }
        let nodes = item?.modules?.module_dynamic?.desc?.rich_text_nodes;
        if (nodes) {
            for (let i = 0; i < nodes.length; i++) {
                // 处理【】的问题
                if (nodes[i]?.text && nodes[i].text.includes('【')) {
                    let splitResult = nodes[i].text.split(/(【.+?】)/g).filter(str=>{return str != ""});
                    nodes.splice(i,1)
                    for (let idx in splitResult) {
                        if (splitResult[idx] in chn_emote_dict) {
                            let replace = chn_emote_dict[splitResult[idx]];
                            let node = {
                                "orig_text": replace.text,
                                "text": replace.text,
                                "type": "RICH_TEXT_NODE_TYPE_EMOJI",
                                "emoji": {
                                    "icon_url": replace.url,
                                    "size": 2,
                                    "text": replace.text,
                                    "type": 3
                                }
                            }
                            nodes.splice(i,0,node);
                            i++;
                        } else {
                            let node = {
                                "orig_text": splitResult[idx],
                                "text": splitResult[idx],
                                "type": "RICH_TEXT_NODE_TYPE_TEXT"
                            }
                            nodes.splice(i,0,node);
                            i++;
                        }
                    }
                } else if (nodes[i].text in emote_dict) {
                    nodes[i].type = 'RICH_TEXT_NODE_TYPE_EMOJI'
                    nodes[i].emoji = {
                        "icon_url": emote_dict[nodes[i].text].url,
                        "size": 2,
                        "text": nodes[i].text,
                        "type": 3
                    }
                }
            }
        }
        if (item?.orig) {
            injectDynamicItem(item.orig, emote_dict, chn_emote_dict);
        }
    }
    let injectReplyItem = function(item, chn_emote_dict) {
        if (!item) return;

        if (item?.content?.message?.includes('【')) {
            if (!('emote' in item.content)) {
                item.content.emote = {};
            }
            for (let emote_name in chn_emote_dict) {
                if (item.content.message.includes(emote_name)) {
                    let replace = chn_emote_dict[emote_name];
                    item.content.message = item.content.message.replace(new RegExp(emote_name,"gm"), " " + replace.text);
                    item.content.emote[replace.text] = replace;
                }
            }
        }
        if ('replies' in item && item.replies) {
            for (let idx in item.replies) {
                injectReplyItem(item.replies[idx], chn_emote_dict);
            }
        }
    }

    // 页面加载完成后添加表情配置面板按钮
    unsafeWindow.addEventListener('DOMContentLoaded', () => {
        let vPoperMutation = new MutationObserver(async (mutationList, observer) => {
            for (const mutation of mutationList) {
                if (mutation.type !== 'childList' || mutation.addedNodes.length === 0) continue;
                for (const node of mutation.addedNodes) {
                    if(node.classList?.contains('v-popover') && node.classList?.contains('is-bottom')) {
                        createEmoteBtn();
                        vPoperMutation.disconnect();
                    }
                }
            }
        });
        let emoteMutation = new MutationObserver(async (mutationList, observer) => {
            for (const mutation of mutationList) {
                if (mutation.type !== 'childList' || mutation.addedNodes.length === 0) continue;
                for (const node of mutation.addedNodes) {
                    if(node.classList?.contains('right-entry')) {
                        vPoperMutation.observe(node.childNodes[0], { childList: true, subtree: true });
                        emoteMutation.disconnect();
                    }
                }
            }
        });

        let entryNode = unsafeWindow.document.querySelector('.right-entry');
        if (entryNode) {
            vPoperMutation.observe(entryNode.childNodes[0], { childList: true, subtree: true });
        } else {
            emoteMutation.observe(unsafeWindow.document.body, { childList: true, subtree: true });
        }
    });

    // 添加XHR钩子,用于增加表情包和注入动态
    xhookLoad.then(async () => {
        // 动态直接通过 Hook XHR 响应完成
        if (GM_getValue('resolved_emote_packs', []).length == 0) {
            await refreshEmote([])
        }
        const resolved_emote_packs = GM_getValue('resolved_emote_packs', [])
        const emote_dict = GM_getValue('emote_dict', {})
        const chn_emote_dict = GM_getValue('chn_emote_dict', {})

        const likeIcons = GM_getValue('like_icons', []);

        unsafeWindow.xhook.before(function(request, callback) {
            if(request.url.includes('//i0.hdslb.com/bfs/garb/item') && likeIcons.length > 0) {
                let animateNum = Math.floor(Math.random() * likeIcons.length);
                let url = likeIcons[animateNum];
                    GM_xmlhttpRequest({
                        url,
                        method : "GET",
                        responseType: "blob",
                        onload : function(data){
                          data.response.arrayBuffer()
                            .then(arr => {
                                callback({
                                  status: 200,
                                  statusText: '',
                                  data: arr,
                                  finalUrl: request.url
                                });
                            })
                        },
                        onerror : function(err) {
                          callback();
                        }
                    });
            } else {
              callback();
            }
        });

        unsafeWindow.xhook.after(function(request, response) {
            if (request.url.includes('//api.bilibili.com/x/emote/user/panel/web?business=reply')) {
                // 表情包面板
                let response_json = JSON.parse(response.text);
                response_json.data.packages = response_json.data.packages.concat(resolved_emote_packs);
                response.text = JSON.stringify(response_json);
            } else if (request.url.includes('//api.bilibili.com/x/polymer/web-dynamic/v1/detail')){
                // 动态详情页
                let response_json = JSON.parse(response.text);
                injectDynamicItem(response_json?.data?.item, emote_dict, chn_emote_dict);
                response.text = JSON.stringify(response_json);
            } else if (request.url.includes('//api.bilibili.com/x/polymer/web-dynamic/v1/feed/space') || request.url.includes('//api.bilibili.com/x/polymer/web-dynamic/v1/feed/all')) {
                // 主时间线和个人主页
                let response_json = JSON.parse(response.text);
                for (let i in response_json.data.items) {
                    injectDynamicItem(response_json.data.items[i], emote_dict, chn_emote_dict);
                }
                response.text = JSON.stringify(response_json);
            } else if (request.url.includes('//app.bilibili.com/x/topic/web/details/cards')) {
                // 话题页
                let response_json = JSON.parse(response.text);
                for (let i in response_json.data.topic_card_list.items) {
                    let item = response_json.data.topic_card_list.items[i]
                    if (item.topic_type == 'DYNAMIC') {
                        injectDynamicItem(item.dynamic_card_item, emote_dict, chn_emote_dict);
                    }
                }
                response.text = JSON.stringify(response_json);
            } else if (request.url.includes('//api.bilibili.com/x/v2/reply/main')) {
                // 手机网页用的是XHR...
                let response_json = JSON.parse(response.text);
                if (response_json.data.top_replies) {
                    for (let i in response_json.data.top_replies) {
                        injectReplyItem(response_json.data.top_replies[i], chn_emote_dict);
                    }
                }
                for (let i in response_json.data.replies) {
                    injectReplyItem(response_json.data.replies[i], chn_emote_dict);
                }
                response.text = JSON.stringify(response_json);
            } else if (request.url.includes('//api.bilibili.com/x/v2/reply/add')) {
                // 新增评论的 POST 接口,返回值中是处理过的评论内容
                // 拦截这个就可以新增后立刻显示表情包
                let response_json = JSON.parse(response.text);
                injectReplyItem(response_json.data.reply, chn_emote_dict);
                response.text = JSON.stringify(response_json);
            }
        });
    })

    // 添加jsonp钩子,评论数据使用jsonp方式获取,修改jquery的函数进行代理
    // jquery jsonp 原理见 https://www.cnblogs.com/aaronjs/p/3785646.html
    const jsonpMutation = new MutationObserver(async (mutationList, observer) => {
        if (GM_getValue('resolved_emote_packs', []).length == 0) {
            await refreshEmote([])
        }
        const resolved_emote_packs = GM_getValue('resolved_emote_packs', [])
        const emote_dict = GM_getValue('emote_dict', {})
        const chn_emote_dict = GM_getValue('chn_emote_dict', {})

        for (const mutation of mutationList) {
            if (mutation.type !== 'childList' || mutation.addedNodes.length === 0) continue;

            for (const node of mutation.addedNodes) {
                if (node.localName !== 'script') continue;

                const src = node.src;
                if (src.includes('//api.bilibili.com')) {
                    const matchResult = src.match(/callback=(.*?)&/);
                    if (!matchResult) return;
                    const callbackName = matchResult[1];
                    const originFunc = unsafeWindow[callbackName];

                    unsafeWindow[callbackName] = (value) => {
                        if (src.includes('//api.bilibili.com/x/v2/reply')) {
                            for (let i in value.data.replies) {
                                injectReplyItem(value.data.replies[i], chn_emote_dict);
                            }
                            if (value.data.top_replies) {
                                for (let i in value.data.top_replies) {
                                    injectReplyItem(value.data.top_replies[i], chn_emote_dict);
                                }
                            }
                            if (value.data.top) {
                                injectReplyItem(value.data.top.upper, chn_emote_dict);
                            }
                            if (value.data.upper) {
                                injectReplyItem(value.data.upper.top, chn_emote_dict);
                            }
                        }

                        originFunc(value);
                    }
                }
            }
        }
    });
    jsonpMutation.observe(unsafeWindow.document.head, { childList: true, subtree: true });
 })();