訪問圖片出現403的解決辦法

在寫小程序的時候,訪問一個網址獲取圖片,可是顯示會出現403(防止盜鏈)的錯誤.
總結了一下,有兩種方法是能夠解決這個問題的:

• 使用images.weserv.nl方案
• 使用no-referrer方案

第一種:使用images.weserv.nl方案

getImage(url){ console.log(url); // 把如今的圖片鏈接傳進來，返回一個不受限制的路徑
    if(url !== undefined){ return url.replace(/^(http)[s]*(\:\/\/)/,'https://images.weserv.nl/?url='); } }

把圖片路徑直接傳進去,替換一下原來url的http/https.或者直接在圖片url前加上https://images.weserv.nl/?url=
如:

https://images.weserv.nl/?url=http://img.zcool.cn/community/01d881579dc3620000018c1b430c4b.JPG@3000w_1l_2o_100sh.jpg

 

原圖片的http://是能夠省略的(與上面的getImage函數是同樣的結果)

https://images.weserv.nl/?url=mg.zcool.cn/community/01d881579dc3620000018c1b430c4b.JPG@3000w_1l_2o_100sh.jpg

第二種:使用no-referrer方案

這種方案不只針對圖片的防盜鏈,還能夠是其餘標籤.
在前端頁面頭部添加一個meta

<meta name="referrer" content="no-referrer" />

referrer的幾種狀態

 

a標籤的referrer

<a href="http://example.com" referrer="no-referrer|origin|unsafe-url">xxx</a>

img/image標籤的referrer

<img referrer="no-referrer|origin|unsafe-url" src="{{item.src}}"/>
<image referrer="no-referrer|origin|unsafe-url" src="{{item.src}}"></image>

說明

若是咱們是訪問的gif圖片,使用第一種方案是沒有gif效果的,只能顯示靜態圖片.這個時候推薦你們使用第二種.親測能夠完美展現gif效果.

 

 

 from:https://blog.csdn.net/tiantang_1986/article/details/83748782