前端黑科技-如何使用防盜鏈圖片

如何使用防盜鏈圖片

此文無心冒犯任何圖片庫或視頻庫，意在發揚技術自己，因此，這裏就拿本身的服務器作實驗

圖片地址：

http://mmbiz.qpic.cn/mmbiz/PckLehCib4pkA0ZkSicaXt8icMxfeiaGIhWZSLAHv54DkLvLiaDAXCOibc9p73JDfQ2ic3MbKryjYoPrHxsjTf9NeJNUg/640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1

這是一個具備防盜鏈的圖片，若是你直接拿來放到本身服務器，勢必沒法顯示。

理論上講
若是一個圖片直接在瀏覽器打開鏈接可以訪問到，那麼，就能夠在你的網站正常顯示（能夠徹底忽視他的防盜鏈）

• 建一個空的iframe
• iframe設置src，內容就是圖片或一段html

var body = document.querySelector("body");
var iframe = document.createElement("iframe");
var html = '<img src="http://json.image.alimmdn.com/vsou.png"/>';
iframe.src = 'javascript:void(function(){document.open();document.write(\'' + html + '\');document.close();}())';
body.appendChild(iframe);

略微設置一下樣式

iframe.style.position="fixed";
iframe.style.width="100%";
iframe.style.height="100%";
iframe.style.border=0;
iframe.style.zIndex=10;
iframe.style.top=0;
iframe.style.left=0;

上面一段代碼有一個關鍵因素，就是在iframe以外，不能有任何其餘圖片該域名（示例圖片所在域名）下的圖片，不然功虧一簣

具體原理：
防盜鏈圖片，是被服務器判斷了header中的referer的，可是若是referer=null，那就能夠拿到圖片了