quicklink配置

引入quicklink库文件

引入库文件。这里考虑了外网速度问题，直接将库文件复制到了服务器本地并在全部页面引入:

<script src="https://www.domain.com/js/quicklink.jsv=2.0.0"></script>

当前的版本是2.0.0(alpha)所以，在引用后面加入了版本号，当有更新的时候同步修改

API调用

创建一个配置文件(loadQL.js)并在全部页面引入

/*
使用方法：
1. 先在页面引入 quicklink.js 文件,注意路径，由于这个是库文件不经常改动，当前发布的版本是2.0.0，。
   所以建议文件名quicklink.js后面再直接加当前版本号
     <script src="/js/quicklink.js?v=2.0.0"></script>
2. 当quiclink.js文件引入完成之后，再在全局配置文件里面写入下面内容，
    或者直接引入当前文件（需要适当修改）,注意，主动和被动方式请二选其一
*/
/*
在页面中
        <script src="/js/quicklink.js?v=2.0.0"></script>
        <script src="/js/loadQL.js"></script>
*/
//被动监听模式
window.addEventListener('load', () => {
    quicklink.listen({
        //timeout:2000,
        priority: true,
        origins: [
             // 下面需要抓取的domain 请酌情修改
            // add mine
            'my-website.com',
            'api.my-website.com',
            // add third-parties
            'other-website.com',
            'example.com',
            // ...
        ],
        ignores: [
            /\/api\/?/,
            uri => uri.includes('.zip'),
            (uri, elem) => elem.hasAttribute('noprefetch')
        ]
    });
});
//主动抓取模式 
// 提交你想抓取的链接
window.addEventListener('load', () => {
    let anchors=document.getElementsByTagName('a');
    let  imgs=document.getElementsByTagName('img');
    let videos=document.getElementsByTagName('video');
    let anchorsArrs=[]
    for(let i=0;i<anchors.length;i++){
         anchorsArrs.push(anchors[i].href)
    }
    let imgsArrs=[]
    for(let i=0;i<imgs.length;i++){
         imgsArrs.push(imgs[i].src)
    }
    let videosArrs=[]
    for(let i=0;i<videos.length;i++){
         videosArrs.push(videos[i].src)
    }
    let urls = anchorsArrs.concat(imgsArrs, videosArrs);
    quicklink.prefetch(urls,true);
});

以上的配置文件内容，分为主动模式(prefetch)和被动模式(listen)，建议使用被动模式，主动模式提交的urls是你所需要的链接（数组），这个容易造成控制台报错等情况。