关于防盗链的方法之HTTP的referer检查

HTTP Referer 是包含在 HTTP 请求头中的字段，它包含了请求的来源页面的 URL。你可以通过检查 Referer 头来确定请求资源的页面是否来自你的网站。如果 Referer 头不匹配你的网站域名，你可以拒绝提供资源

目录

源码讲解:

注意:

关于防盗链的实现啊方法还有另外两种(使用Token或签名,设置CORS),本篇只介绍referer的方法

话不多说先放源码演示:(我的html放在了/test目录下,内容只有一个图片)

const express = require('express')
const app = express()
const port = 3000
app.use((req, res, next) => {
    // 检测请求头中的referer是否为127.0.0.1
    // 获取referer
    let referer = req.get('Referer')
    let Accept = req.get('Accept')
    console.log('Accept',Accept)
    console.log('referer第一次打印',referer)
    // 第一次html请求,所以会打印一次,但是没有referer字段,所以直接next(),第二次img请求,有了referer字段,所以打印出请求路径http://127.0.0.1:3000/aaa.html再next()
    if (referer) {
    //     // 实例化
    console.log('referer第二次打印',referer)
        let url = new URL(referer)
        console.log('url',url)
        // 获取hostname
        let hostname = url.hostname
        console.log('referer第三次打印',referer)
        console.log(hostname);
        if(hostname!=='127.0.0.1'){
            res.status(404).send('<h1>404 not found</h1>')
            return
        }
    }

    next()
})
app.use(express.static(__dirname + '/test'))
app.listen(port, () => console.log(`Example app listening on port ${port}!`))

源码讲解:

首先就是声明express模块以及设置请求端口等基本结构搭建

声明两个中间件函数,一个用来设置网站资源的防盗链,底下那个用来加载静态资源中间件,我是加载我的根目录下的/test目录作为网站的根目录

我在我的第一个中间件函数定义了两个变量referer和Accpt两个变量分别用来获取请求头中的 Referer和Accept 字段的值

接着进行判断如果请求头中包含 Referer 字段，则实例化一个 URL 对象，并打印出该对象的信息，包括请求路径等。

如果请求的 hostname 不是 '127.0.0.1'，则返回 404 错误页面；否则，继续执行下一个中间件

注意:

你可以在我的代码中发现有三次打印referer,但是实际终端最终会出现四次打印的referer,而其中referer第一次打印会打印两次,分别返回undefined和http://127.0.0.1:3000/网站名.html

那是因为第一次html请求,所以会打印一次,但是没有referer字段,所以直接next(),第二次img请求,有了referer字段,所以打印出请求路径http://127.0.0.1:3000/网站名.html再next()