跳过掘金，CSDN，知乎跳转外链前的中转页面的方案：TamperMonkey

Tampermonkey 是一款流行的浏览器扩展，允许用户通过编写自定义脚本来增强网页的功能。这些脚本可以在网页加载时自动运行，修改网页的内容、样式或行为。无论你是想自动填充表单、隐藏广告，还是增强网页的交互体验，Tampermonkey 都能帮你实现。

准备工作

从 Chrome 扩展商店安装 TamperMonkey：chromewebstore.google.com/detail/tamp…

打开 TamperMonkey 控制面板

安装好 Tampermonkey 后，点击浏览器工具栏上的 Tampermonkey 图标，选择 Create a new script

填写脚本元数据

在脚本编辑器中，首先需要填写一些元数据，这些元数据用于描述脚本的基本信息，例如名称、版本、作者等。元数据以// ==UserScript==和// ==/UserScript==之间的注释形式存在。例如：

// ==UserScript==
// @name         Sample Script
// @namespace    https://github.com/Vic-wkx
// @version      0.1
// @description  Adds a simple button to the page
// @author       Vic-wkx
// @match        *://*/*
// @icon         https://avatars.githubusercontent.com/u/25922127?v=4
// @grant        none
// ==/UserScript==

各字段含义如下：

• @name：脚本的名称。
• @namespace：命名空间，用于避免脚本冲突。TamperMonkey 通过 namespace 和 name 的组合来唯一标识一个脚本。即使两个脚本的名称相同，不同的 namespace 会让 TamperMonkey 将它们视为不同的脚本。
• @version：脚本的版本号。
• @description：脚本的描述。
• @author：脚本的作者。
• @match：指定脚本运行的网页范围。*://*/*表示在所有网页上运行。
• @icon：指定脚本图标。
• @grant：声明脚本需要的权限。none表示不需要特殊权限。

编写脚本代码

在元数据之后，就可以编写脚本的主体代码了。以下是实现一个在页面上添加一个按钮的简单示例：

(function() {
    'use strict';
    var button = document.createElement('button'); // Create a new button element
    button.textContent = 'Click Me'; // Set the text content of the button
    button.style.position = 'fixed'; // Set the button's position to fixed
    button.style.top = '10px'; // Position the button 10 pixels from the top
    button.style.right = '10px'; // Position the button 10 pixels from the right
    button.style.zIndex = '999999'; // Ensure the button is above other elements
    button.style.padding = '10px'; // Add padding inside the button
    button.style.fontSize = '16px'; // Set the font size of the button text
    button.style.backgroundColor = '#4CAF50'; // Set the background color to green
    button.style.color = 'white'; // Set the text color to white
    button.style.border = 'none'; // Remove the border from the button
    button.style.borderRadius = '5px'; // Add rounded corners to the button
    button.style.cursor = 'pointer'; // Change the cursor to a pointer on hover

    button.addEventListener('click', function() {
        alert('你点击了按钮！');
    });

    document.body.appendChild(button);
})();

编写完成后，点击 File -> Save 保存脚本

测试

随便打开一个网页，就能看到右上角出现了这个新按钮了：

点击按钮，可以看到点击事件也生效了。

点击浏览器工具栏上的 Tampermonkey 图标，可以看到这个脚本正在工作：

如果不希望这个脚本在此网站上工作，可以选择排除此网站：

已排除的网站可以在脚本编辑界面的 Settings 页面中找到，取消排除也是在这里设置：

编写一个脚本，移除跳转拦截

跳转外链时，有时候会出现跳转拦截的安全提示。笔者猜测是为了安全合规不得不做的，但这种拦截的次数多了确实让人烦不胜烦。我们可以写一个脚本移除跳转拦截，直接跳到目的地。缺点是需要自己辨别网站是否安全，优点是方便快捷。

效果：

可以看到，虽然还是会出现安全提示页面，但很快就自动跳转到了目标地址。

脚本代码如下：

// ==UserScript==
// @name         Redirect Interceptor
// @namespace    https://github.com/Vic-wkx
// @version      1.0
// @description  Bypasses common redirect pages to directly access the target URL
// @author       Vic-wkx
// @match        *://*/*
// @icon         https://avatars.githubusercontent.com/u/25922127?v=4
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Define common redirect patterns
    const redirectPatterns = [
        { pattern: /https:\/\/link\.juejin\.cn\/\?target=(.+)/, target: (match) => decodeURIComponent(match[1]) },
        { pattern: /https:\/\/link\.zhihu\.com\/\?target=(.+)/, target: (match) => decodeURIComponent(match[1]) },
        { pattern: /https:\/\/link\.csdn\.net\/\?target=(.+)/, target: (match) => decodeURIComponent(match[1]) }
    ];

    // Check if the current URL matches any redirect pattern
    for (const { pattern, target } of redirectPatterns) {
        const match = window.location.href.match(pattern);
        if (match) {
            // Redirect to the target URL
            window.location.href = target(match);
            break;
        }
    }
})();

这里定义了一个 redirectPatterns 数组，包含了常见的跳转模板，每个模板是一个对象。包含：

• pattern ：一个正则表达式，用于匹配跳转页面的 URL。
• target：一个函数，用于从匹配的 URL 中提取目标 URL。

然后遍历 redirectPatterns 数组：

• 使用 window.location.href.match(pattern) 检查当前页面的 URL 是否匹配某个跳转模板。
• 如果匹配，调用 target(match) 函数提取目标 URL，并通过 window.location.href 将用户重定向到目标 URL。其中，decodeURIComponent 是 JavaScript 的一个内置函数，用于对通过 encodeURIComponent 编码的 URI（统一资源标识符）组件进行解码。它将编码后的字符串转换回原始字符串，恢复其中的特殊字符和空格。

如果需要支持更多的跳转页面，可以将对应的 URL 模式和提取逻辑添加到 redirectPatterns 数组中。

升级脚本

在使用此脚本时，发现一个问题。比如这个 URL 匹配失败了：

https://link.csdn.net/?from_id=125133761&target=https%3A%2F%2Ffirebase.google.com%2Fdocs%2Fml-kit%2Fandroid%2Frecognize-text%3Fhl%3Dzh-cn

原因很简单，因为 target 不是 ? 后的第一个参数，之前的正则匹配无法匹配到，所以我更新了另一版：

// ==UserScript==
// @name         Redirect Interceptor
// @namespace    https://github.com/Vic-wkx
// @version      2.0
// @description  Bypasses common redirect pages to directly access the target URL
// @author       Vic-wkx
// @match        https://link.juejin.cn/?*
// @match        https://link.zhihu.com/?*
// @match        https://link.csdn.net/?*
// @icon         https://avatars.githubusercontent.com/u/25922127?v=4
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // 检查当前 URL 是否是跳转页面
    const url = new URL(window.location.href);
    const target = url.searchParams.get('target');

    // 如果存在 target 参数，解码并跳转到目标 URL
    if (target) {
        window.location.href = decodeURIComponent(target);
    }
})();

通过 @match：指定脚本运行的网页范围。这里列出了三个跳转页面的 URL 模板：

• https://link.juejin.cn/?*：匹配所有以 https://link.juejin.cn/ 开头的 URL。
• https://link.zhihu.com/?*：匹配所有以 https://link.zhihu.com/ 开头的 URL。
• https://link.csdn.net/?*：匹配所有以 https://link.csdn.net/ 开头的 URL。

然后，使用 URL 构造函数创建一个 URL 对象，表示当前页面的 URL。url.searchParams 是一个 URLSearchParams 对象，用于解析 URL 的查询字符串部分。使用 URLSearchParams 对象的 get 方法提取查询参数中的 target 参数值。最后将 target 参数解码，将 window.location.href 设置为目标 URL，从而跳转到目标页面。

更多功能可参考官方文档：www.tampermonkey.net/documentati…

TamperMonkey Github 仓库地址：github.com/Tampermonke…

参考文章：juejin.cn/post/749597…