web 突破防盗链实战

html head区添加下列内容。

<meta name="referrer" content="no-referrer" />
<meta name="referrer" content="never"/>
<meta name="referrer" content="same-origin"/> 

Referrer-Policy - HTTP | MDN
update:2021-8-18
集成到 HTML
你也可以在 HTML 内设置 referrer 策略。例如，你可以用一个 name 为 referrer 的 <meta> 元素为整个文档设置 referrer 策略。

<meta name="referrer" content="origin">

或者用 a、area、img、iframe、script 或者 link 元素上的 referrerpolicy 属性为其设置独立的请求策略。

<a href="http://example.com" referrerpolicy="origin">

另外也可以在 <a>、<area> 或者 <link> 元素上将 rel 属性设置为 noreferrer。

<a href="http://example.com" rel="noreferrer">

Referenced from:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/Referrer-Policy

如果你要为那些策略未获广泛的浏览器支持的情况指定一种后备策略，使用逗号分隔的列表，并将希望使用的策略放在最后：

Referrer-Policy: no-referrer, strict-origin-when-cross-origin
在上面的场景中，no-referrer 仅在 strict-origin-when-cross-origin 不被浏览器支持的情况下被使用。

来几个防盗图片



还有一种更新型的反反盗链技术。
html img request
Set custom header for the request made from <img/> tag

<img src onerror="fetch('https://picsum.photos/200',{headers: {hello:'World!'}}).then(r=>r.blob()).then(d=> this.src=window.URL.createObjectURL(d));" />

看下效果

还有就是使用脚本的方案

var xhr = new XMLHttpRequest();
xhr.responseType = 'blob'; //so you can access the response like a normal URL
xhr.onreadystatechange = function () {
    if (xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
        var img = document.createElement('img');
        img.src = URL.createObjectURL(xhr.response); //create <img> with src set to the blob
        document.body.appendChild(img);
    }
};
xhr.open('GET', 'http://images.example.com/my_secure_image.png', true);
xhr.setRequestHeader('SecretPassword', 'password123');
xhr.send();

本文链接地址：https://const.net.cn/334.html