前言
-
之前碰到一個問題，就是html中通過img標簽引入一個圖片地址，報403。但是這個圖片地址直接復制出來在地址欄打開，卻是看得到的。
- 先說下解決方法： 在HTML代碼的head中添加一句
<meta name="referrer" content="no-referrer" />即可，后面再說下原理。
http請求中的referrer
-
http請求體的header中有一個referrer字段，用來表示發起http請求的源地址信息，這個referrer信息是可以省略但是不可修改的，就是說你只能設置是否帶上這個referrer信息，不能定制referrer里面的值。
-
服務器端在拿到這個referrer值后就可以進行相關的處理，比如圖片資源，可以通過referrer值判斷請求是否來自本站，若不是則返回403或者重定向返回其他信息，從而實現圖片的防盜鏈。上面出現403就是因為，請求的是別人服務器上的資源，但把自己的referrer信息帶過去了，被對方服務器攔截返回了403。
-
在前端可以通過meta來設置referrer policy(來源策略)，具體可以設置哪些值以及對應的結果參考這里。所以針對上面的403情況的解決方法，就是把referrer設置成
no-referrer，這樣發送請求不會帶上referrer信息，對方服務器也就無法攔截了。
隱藏referrer信息后，圖片資源可以正常訪問 -
瀏覽器中referrer默認的值是
no-referrer-when-downgrade，就是除了降級請求的情況以外都會帶上referrer信息。降級請求是指https協議的地址去請求http協議，所以上面403的情況還有另一種解決方法就是，請求的圖片地址換成http協議，自己的地址使用http協議，這樣降級請求也不會帶上referrer。
nginx配置圖片防盜鏈
- 最后再說一下這種根據referrer攔截，在服務器如何配置。我自己服務器用的nginx，這里就說下nginx的配置。首先打開nginx的配置文件:
conf/nginx.conf，在server下面添加如下:
location ~* \.(gif|jpg|png|jpeg)$ {
valid_referers none valid.url.com;
if ($invalid_referer) { return 403; } } - 首先第一句以文件格式后綴匹配出圖片資源路徑，然后通過
valid_referers添加合法的referer地址，加上none，表示沒有傳referer也是合法的，最后referer不合法的情況返回403。如果想跳其他地址或返回其他圖片資源可以這樣：rewrite xxx.xxx.com/xxx.jpg。
orgin
- http頭部中還有一個與referrer類似的叫orgin的字段，在發送跨域請求或預檢請求(preflight request)時會帶上這個參數，他用來表示發起請求的服務器地址，這個參數是必定會傳的，然后服務器端用此字段來判斷是否允許跨域。
作者：ITgecko
鏈接：https://www.jianshu.com/p/56df73d0d128
來源：簡書
簡書著作權歸作者所有，任何形式的轉載都請聯系作者獲得授權並注明出處。