Edgeone防盗链边缘函数增加白名单与重定向

盗链会导致其他网站或应用程序直接使用咱们的资源，比如图片、css或者js等，相当于用我们的带宽和服务器去养他的网站。简单来说就是防止直接copy党。这次老白谈的是基于腾讯云EdgeOne 边缘函数来实现的，并且增加了白名单域名的设置与图片重定向功能，有效实现网站防护。

1.边缘函数和防盗链介绍

经过半年使用，发现腾讯云edgeone边缘函数功能十分不错，老白也写了一些相关的教程：

wordpress网站edgeone图片自适应缩放边缘函数

WordPress网站edgeone缓存配置避坑指南

如果你没有使用CDN，宝塔面板和openlitespeed防盗链的开启方法如下：

WordPress网站宝塔面板开启404防盗链教程

cyberpanel+openlitespeed环境静态文件防盗链设置教程

2.Edgeone防盗链边缘函数

本文代码基于不凡博客，过程写得比较简略

详细的添加教程参照：https://wp.bufanz.com/website/tencent-edgeone-function-anti-theft-chain.html

2.1 边缘函数代码

新增了两个小功能：

白名单域名，const whitelist = ['xcbtmw.com', 'xxx.com'];
重定向地址：效果就是首图所示，就是别人用了你网站的图片，那他的网站上都会显示你设置的重定向图片

const fileType = ['jpg', 'jpeg', 'gif', 'png', 'webp', 'js', 'css', 'ico', 'woff', 'woff2'];

const host = ['https://xcbtmw.com']; // 主域名
const whitelist = ['xcbtmw.com', 'xxx.com']; // 白名单域名

const redirectURL = 'https://www.helloimg.com/i/2024/12/09/6756971713bcd.png'; // 重定向地址

async function handleEvent(event) {
    const { request } = event;
    const urlInfo = new URL(request.url);

    // 检查文件类型
    const extMatch = urlInfo.pathname.match(/.([^.]+)$/);
    const ext = extMatch ? extMatch[1].toLowerCase() : '';
    
    // 如果是图片文件类型，校验 Referer
    const imageFileTypes = ['jpg', 'jpeg', 'gif', 'png', 'webp'];
    if (imageFileTypes.includes(ext)) {
        const referer = request.headers.get('Referer');
        // 如果 Referer 不存在或不在白名单中，重定向
        if (!referer || !whitelist.some(domain => referer.includes(domain))) {
            console.log(`Redirecting non-whitelisted image request to ${redirectURL}`);
            return event.respondWith(Response.redirect(redirectURL, 302));
        }
    }

    // 对于非图片文件类型的请求，进行正常防盗链校验
    if (!ext || !fileType.includes(ext)) {
        return; // 如果不是需要校验的文件类型，直接 passthrough
    }

    const referer = request.headers.get('Referer');
    const blockRes = new Response(null, { status: 404 });

    // 无 Referer，响应 404
    if (!referer) {
        return event.respondWith(blockRes);
    }

    // 校验 Referer 是否在白名单内
    const isWhitelisted = whitelist.some(domain => referer.includes(domain));
    if (!isWhitelisted) {
        console.log('referer block');
        return event.respondWith(blockRes);
    }

    // 校验通过，直接 passthrough
    return;
}

addEventListener('fetch', event => {
    event.passThroughOnException();
    handleEvent(event);
});

2.2 触发配置

选择and，然后host填写你添加的网站域名，URL Path选择图片：/wp-content/*

更多网站防护教程可点击文末标签阅读。