80 # 图片防盗链

简介: 80 # 图片防盗链

referer 来源,表示这个资源被谁引用过,可以用来做防盗链。

我们新建文件 no-referer.js

const fs = require("fs");
const path = require("path");
const url = require("url");
const http = require("http");
http.createServer((req, res) => {
    const { pathname } = url.parse(req.url, true);
    const absPath = path.join(__dirname, pathname);
    fs.stat(absPath, (err, statObj) => {
        if (err) res.end("Not Found");
        console.log("absPath----->", absPath);
        console.log("statObj----->", statObj);
        if (statObj) {
            console.log(statObj.isDirectory());
            console.log(statObj.isFile());
            if (statObj.isFile()) {
                fs.createReadStream(absPath).pipe(res);
            } else {
                res.end("Not Found");
            }
        } else {
            res.end("Not Found");
        }
    });
}).listen(3000);

新建文件 index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>凯小默测试图片防盗链</title>
        <!-- <meta name="referrer" content="never" /> -->
    </head>
    <body>
        <img src="http://127.0.0.1:3000/docker.jpg" alt="" />
    </body>
</html>

添加两张图片

启动服务:

nodemon no-referer.js

访问 http://127.0.0.1:3000/docker.jpg,可以看到图片直接打开是不会增加 referer 的

我们另外用 live server 启动服务,访问 http://127.0.0.1:5500/doc/80/index.html,我们可以看到图片的请求头加上了 referer

如果要实现引用我的人和我的域不是同一个,应该返回错误图片,我们应该进行校验

const fs = require("fs");
const path = require("path");
const url = require("url");
const http = require("http");
http.createServer((req, res) => {
    const { pathname } = url.parse(req.url, true);
    const absPath = path.join(__dirname, pathname);
    fs.stat(absPath, (err, statObj) => {
        if (err) return res.end("Not Found");
        console.log("absPath----->", absPath);
        console.log("statObj----->", statObj);
        if (statObj) {
            console.log(statObj.isDirectory());
            console.log(statObj.isFile());
            if (statObj.isFile()) {
                // 只对图片进行防盗链,如果请求路径是 .jpg 结尾的需要判断引用的来源
                if (/\.jpg/.test(absPath)) {
                    let referer = req.headers["referer"] || req.headers["referrer"];
                    if (referer) {
                        // 拿 host 跟 referer 比较
                        let host = req.headers.host;
                        refererHost = url.parse(referer).host;
                        console.log("host----->", host);
                        console.log("refererHost----->", refererHost);
                        if (host !== refererHost) {
                            fs.createReadStream(path.resolve(__dirname, "referer.jpg")).pipe(res);
                            return;
                        }
                    }
                }
                fs.createReadStream(absPath).pipe(res);
            } else {
                res.end("Not Found");
            }
        } else {
            res.end("Not Found");
        }
    });
}).listen(3000);

我们启动服务,访问 http://127.0.0.1:5500/doc/80/index.html,我们可以看到 docker 的图片访问不了,而是展示了防盗的图片

nodemon referer.js

要展示 docker 图片的话,我们就应该去访问 访问 http://127.0.0.1:3000/index.html,保证域相同

另外可以加上 meta 标签,不带 referer,如果网站没有 referer 会导致发送任何资源都不会带 referer

<meta name="referrer" content="never" />

注意:单词 referer 是错误的写法,正确的单词应该是 referrer,感兴趣可以看这篇:Referrer 还是 Referer?

目录
相关文章
|
2月前
|
人工智能
图片生成很好用
图片展示了一张图表,图中通过不同的颜色和数据点展示了某项技术或产品在不同维度上的表现情况。标题“AI也很好用”表明该图表可能是在说明人工智能技术的实用性和效果。不过,由于缺少具体的数据和背景信息,无法提供更详细的解读。
图片生成很好用
|
2月前
图片的大小
【10月更文挑战第7天】
39 1
|
编解码 开发工具 Android开发
.9图片的那点事儿
.9图片的那点事儿
186 0
|
弹性计算 负载均衡 网络协议
源站保护
源站保护
192 0
源站保护
|
Java JavaScript 前端开发
解决图片 防盗链
js版解决方案 var url = 'https://mmbiz.qpic.cn/mmbiz_jpg/TAoksPVlXMI7dQPxiaUbAHvyJ19iaG9b2Ueh53iaqTsn6F8O3m63zcBibgNpujM1HNeCKX99vOo...
1859 0
|
缓存 Android开发
图片
●图片加载,缓存,处理 Picasso (一个强大的图片下载与缓存的库) Fresco (一个用于管理图像和他们使用的内存的库) Glide (一个图片加载和缓存的库,使用的App有:网易新闻) Picasso-transformations (...
1408 0