给博客加入链接安全跳转页(添加一个和CSDN一样的链接跳转页)

前言

或是出于优化 SEO，或是出于加强网站体验，很多博客都给文章中的外部链接加上了个二次跳转，本博客也不例外。

在逛别人的博客的时候，发现了有一种叫 go.php的东西，可以经过自己站点的网页再跳转出去，方便SEO优化。但是像Hexo这类静态博客，想要从源HTML修改链接难度有点大，这里我们采用JavaScript动态修改

部署

点我fork此仓库，然后在vercel中部署

或使用他部署

修改

打开 `js/index.js`修改个人信息

$(document).ready(()=>{
console.log("Running...")
    if(window.location.hash===""){
        document.getElementsByClassName("loading-text")[0].innerHTML = "参数错误，将跳转回青云工作室<dot>...</dot>"
        setTimeout(()=>{
            window.location.href = "https://qystu.cc/"/* 这里 */
        },5000)
        return;
    }
    let reg = new RegExp(/#(.*)/g);
    let base64 = reg.exec(window.location.hash)
    let link = window.atob(base64[1])
    let referrer = document.referrer.split('/')[2];
    referrer = referrer===undefined?"":referrer.split('.')
    if(referrer[referrer.length-2]+'.'+referrer[referrer.length-1]!="pai233.top" || document.referrer===""){
        swal.fire({
            title: "确定访问？",
            text: "该网址不属于青云工作室，你确定要打开"+link+"吗？",/* 这里 */
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "确定",
            cancelButtonText: "取消",
          }).then(function(isConfirm){
            console.log(isConfirm)
            if (isConfirm) {
                console.log('setTimeout')
                setTimeout(function(){
                    window.location.href = link
                },3000)
            }  
            else {
                window.opener=null;
                window.open('','_self');
                window.close();
                /* 微信浏览器关闭 */ 
                WeixinJSBridge.call('closeWindow');
            }
        })
    }else{
        setTimeout(function(){
            window.location.href = link
        },3000)
    }
})

打开 `js/checker.js`

$(document).ready(function(){
    checkLink();
});
// 若博客启用了Pjax请去掉注释。
// $(document).on('pjax:complete', function () {
//     checkLink();
// });
async function checkLink(){
    let link = document.getElementsByTagName('a');
    for(var i=0;i<link.length;i++){
        //如果你的博客添加了Gitter聊天窗，请去掉下方注释
        if(link[i].href==="" /*|| link[i].className==="gitter-open-chat-button"*/)continue;
        if(!await checkLocalSite(link[i].href)){
            link[i].href = "[你的Go Jumper的部署地址]#"+window.btoa(link[i].href)
            //console.log("edit.")
        }
    }
}
async function checkLocalSite(url){
    try{
        //console.log("check:",url)
        let reg = new RegExp(/\/\/(.*)\//g)
        let domain = reg.exec(url)[1].split('/')[0].split('.')
        //console.log(domain,domain[domain.length-2]+'.'+domain[domain.length-1])
        domain = {
            //二级域名请去除下一行的注释
            check: (/*domain[domain.length-3]+'.'+*/domain[domain.length-2]+'.'+domain[domain.length-1]).split('/')[0],
            original: domain
        }
        //console.log(domain)/* 这里 */
        if(domain.check==="qystu.cc" || domain.original[0].split('/')[0]==="localhost:4000")return true;//将domain.check修改为根或二级域名，domain.original[0].split('/')[0]修改为本地测试页面
        return false;
    }catch(err){
        return true;
    }
}

引入

最后在博客的 _config.yml中引入
例如vlts的

1
2
3

import:
  script:
    - <script src="https://cdn.jsdelivr.net/gh/qystudio0/go-jumper/js/checker.js"></script>

如果你的主题不支持引入那么可以在head里添加

1	<script src="https://cdn.jsdelivr.net/gh/qystudio0/go-jumper/js/checker.js"></script>

结语

这样，当博客加载完毕的时候，博客的全部外链就会被加上二级跳转，但是源HTML里的外链不变。可以优化 SEO和加强网站体验

本文修改自pai233

源码参考自go-jumper

给博客加入链接安全跳转页(添加一个和CSDN一样的链接跳转页)

前言

部署

修改

打开 js/index.js修改个人信息

打开 js/checker.js

引入

结语

推荐文章（由hexo文章推荐插件驱动）

打开 `js/index.js`修改个人信息

打开 `js/checker.js`