img標(biāo)簽訪問圖片403(http referrer),直接訪問圖片鏈接可以打開

先說下解決方法:

在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字段火惊,用來表示發(fā)起http請(qǐng)求的源地址信息惯裕,這個(gè)referrer信息是可以省略但是不可修改的撞叽,就是說你只能設(shè)置是否帶上這個(gè)referrer信息俏蛮,不能定制referrer里面的值撼泛。

服務(wù)器端在拿到這個(gè)referrer值后就可以進(jìn)行相關(guān)的處理,比如圖片資源吵冒,可以通過referrer值判斷請(qǐng)求是否來自本站纯命,若不是則返回403或者重定向返回其他信息,從而實(shí)現(xiàn)圖片的防盜鏈桦锄。上面出現(xiàn)403就是因?yàn)樵剑?qǐng)求的是別人服務(wù)器上的資源,但把自己的referrer信息帶過去了结耀,被對(duì)方服務(wù)器攔截返回了403留夜。

在前端可以通過meta來設(shè)置referrer policy(來源策略),具體可以設(shè)置哪些值以及對(duì)應(yīng)的結(jié)果參考這里图甜。所以針對(duì)上面的403情況的解決方法碍粥,就是把referrer設(shè)置成no-referrer,這樣發(fā)送請(qǐng)求不會(huì)帶上referrer信息黑毅,對(duì)方服務(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。

nginx配置圖片防盜鏈

最后再說一下這種根據(jù)referrer攔截易结,在服務(wù)器如何配置枕荞。我自己服務(wù)器用的nginx,這里就說下nginx的配置搞动。首先打開nginx的配置文件:conf/nginx.conf躏精,在server下面添加如下:

location ~* \.(gif|jpg|png|jpeg)$ {

????valid_referers none valid.url.com;

????if($invalid_referer){

????????return403;

????}

}

首先第一句以文件格式后綴匹配出圖片資源路徑,然后通過valid_referers添加合法的referer地址鹦肿,加上none矗烛,表示沒有傳referer也是合法的,最后referer不合法的情況返回403箩溃。如果想跳其他地址或返回其他圖片資源可以這樣:rewrite xxx.xxx.com/xxx.jpg高诺。

orgin

http頭部中還有一個(gè)與referrer類似的叫orgin的字段,在發(fā)送跨域請(qǐng)求或預(yù)檢請(qǐng)求(preflight request)時(shí)會(huì)帶上這個(gè)參數(shù)碾篡,他用來表示發(fā)起請(qǐng)求的服務(wù)器地址虱而,這個(gè)參數(shù)是必定會(huì)傳的,然后服務(wù)器端用此字段來判斷是否允許跨域开泽。

referrer的幾種狀態(tài)

方法二: 代理圖片(Airan:親測(cè)有用)

(不支持gif圖片,使用第一種方案是沒有g(shù)if效果的,只能顯示靜態(tài)圖片.)

使用images.weserv.nl方案

小程序端修改

getImage(url){

????console.log(url);//把現(xiàn)在的圖片連接傳進(jìn)來牡拇,返回一個(gè)不受限制的路徑

????if(url!==undefined){

????????returnurl.replace(/^(http)[s]*(\:\/\/)/,'https://images.weserv.nl/?url=');

????}

}

后端修改把圖片路徑直接傳進(jìn)去,替換一下原來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

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子惠呼,更是在濱河造成了極大的恐慌导俘,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,907評(píng)論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件剔蹋,死亡現(xiàn)場(chǎng)離奇詭異旅薄,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)泣崩,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,987評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門少梁,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人矫付,你說我怎么就攤上這事凯沪。” “怎么了买优?”我有些...
    開封第一講書人閱讀 164,298評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵妨马,是天一觀的道長。 經(jīng)常有香客問我杀赢,道長烘跺,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,586評(píng)論 1 293
  • 正文 為了忘掉前任脂崔,我火速辦了婚禮液荸,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘脱篙。我一直安慰自己,他們只是感情好伤柄,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,633評(píng)論 6 392
  • 文/花漫 我一把揭開白布绊困。 她就那樣靜靜地躺著,像睡著了一般适刀。 火紅的嫁衣襯著肌膚如雪秤朗。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,488評(píng)論 1 302
  • 那天笔喉,我揣著相機(jī)與錄音取视,去河邊找鬼。 笑死常挚,一個(gè)胖子當(dāng)著我的面吹牛作谭,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播奄毡,決...
    沈念sama閱讀 40,275評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼折欠,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起锐秦,我...
    開封第一講書人閱讀 39,176評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤咪奖,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后酱床,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體羊赵,經(jīng)...
    沈念sama閱讀 45,619評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,819評(píng)論 3 336
  • 正文 我和宋清朗相戀三年扇谣,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了昧捷。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,932評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡揍堕,死狀恐怖料身,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情衩茸,我是刑警寧澤芹血,帶...
    沈念sama閱讀 35,655評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站楞慈,受9級(jí)特大地震影響幔烛,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜囊蓝,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,265評(píng)論 3 329
  • 文/蒙蒙 一饿悬、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧聚霜,春花似錦狡恬、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,871評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至姥芥,卻和暖如春兔乞,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背凉唐。 一陣腳步聲響...
    開封第一講書人閱讀 32,994評(píng)論 1 269
  • 我被黑心中介騙來泰國打工庸追, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人台囱。 一個(gè)月前我還...
    沈念sama閱讀 48,095評(píng)論 3 370
  • 正文 我出身青樓淡溯,卻偏偏與公主長得像,于是被迫代替她去往敵國和親簿训。 傳聞我的和親對(duì)象是個(gè)殘疾皇子血筑,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,884評(píng)論 2 354