先說(shuō)下解決方法：
在HTML代碼的head中添加一句，
<meta name="referrer" content="no-referrer" />
另外除了全局mate標(biāo)簽外也可以
a標(biāo)簽的referrer
<a referrer="no-referrer|origin|unsafe-url">xxx</a>
img/image標(biāo)簽的referrer
<img referrer="no-referrer|origin|unsafe-url" src="{{item.src}}"/>
<image referrer="no-referrer|origin|unsafe-url" src="{{item.src}}"></image>
http請(qǐng)求中的referrer
http請(qǐng)求體的header中有一個(gè)referrer字段，用來(lái)表示發(fā)起http請(qǐng)求的源地址信息，這個(gè)referrer信息是可以省略但是不可修改的，就是說(shuō)你只能設(shè)置是否帶上這個(gè)referrer信息，不能定制referrer里面的值。
服務(wù)器端在拿到這個(gè)referrer值后就可以進(jìn)行相關(guān)的處理，比如圖片資源，可以通過(guò)referrer值判斷請(qǐng)求是否來(lái)自本站，若不是則返回403或者重定向返回其他信息，從而實(shí)現(xiàn)圖片的防盜鏈。上面出現(xiàn)403就是因?yàn)?，?qǐng)求的是別人服務(wù)器上的資源，但把自己的referrer信息帶過(guò)去了，被對(duì)方服務(wù)器攔截返回了403。
在前端可以通過(guò)meta來(lái)設(shè)置referrer policy(來(lái)源策略)，具體可以設(shè)置哪些值以及對(duì)應(yīng)的結(jié)果參考這里。所以針對(duì)上面的403情況的解決方法，就是把referrer設(shè)置成no-referrer，這樣發(fā)送請(qǐng)求不會(huì)帶上referrer信息，對(duì)方服務(wù)器也就無(wú)法攔截了。
瀏覽器中referrer默認(rèn)的值是no-referrer-when-downgrade，就是除了降級(jí)請(qǐng)求的情況以外都會(huì)帶上referrer信息。降級(jí)請(qǐng)求是指https協(xié)議的地址去請(qǐng)求http協(xié)議，所以上面403的情況還有另一種解決方法就是，請(qǐng)求的圖片地址換成http協(xié)議，自己的地址使用http協(xié)議，這樣降級(jí)請(qǐng)求也不會(huì)帶上referrer。
最后再說(shuō)一下這種根據(jù)referrer攔截，在服務(wù)器如何配置。我自己服務(wù)器用的nginx，這里就說(shuō)下nginx的配置。首先打開(kāi)nginx的配置文件:conf/nginx.conf，在server下面添加如下:
location ~* \.(gif|jpg|png|jpeg)$ {
????valid_referers none valid.url.com;
????if($invalid_referer){
????????return403;
????}
}
首先第一句以文件格式后綴匹配出圖片資源路徑，然后通過(guò)valid_referers添加合法的referer地址，加上none，表示沒(méi)有傳referer也是合法的，最后referer不合法的情況返回403。如果想跳其他地址或返回其他圖片資源可以這樣：rewrite xxx.xxx.com/xxx.jpg。
http頭部中還有一個(gè)與referrer類似的叫orgin的字段，在發(fā)送跨域請(qǐng)求或預(yù)檢請(qǐng)求(preflight request)時(shí)會(huì)帶上這個(gè)參數(shù)，他用來(lái)表示發(fā)起請(qǐng)求的服務(wù)器地址，這個(gè)參數(shù)是必定會(huì)傳的，然后服務(wù)器端用此字段來(lái)判斷是否允許跨域。
方法二: 代理圖片（Airan：親測(cè)有用）
(不支持gif圖片,使用第一種方案是沒(méi)有g(shù)if效果的,只能顯示靜態(tài)圖片.)
使用images.weserv.nl方案
小程序端修改
getImage(url){
????console.log(url);//把現(xiàn)在的圖片連接傳進(jìn)來(lái)，返回一個(gè)不受限制的路徑
????if(url!==undefined){
????????returnurl.replace(/^(http)[s]*(\:\/\/)/,'https://images.weserv.nl/?url=');
????}
}
后端修改把圖片路徑直接傳進(jìn)去,替換一下原來(lái)url的http/https.或者直接在圖片url前加上https://images.weserv.nl/?url=
如:
https://images.weserv.nl/?url=https://xxx.com/name.jpg
原圖片的http://是可以省略的(與上面的getImage函數(shù)是一樣的結(jié)果)
https://images.weserv.nl/?url=xxx.com/name.jpg
