訪問圖片出現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" />

　　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效果.

–補充—
通過試驗,不是多有gif網站都支持第二種方式,仍是有些會失敗.請你們自行試驗.若是有更好的方法能夠一塊兒交流.