創作內容

79 GP

[達人專欄] 為什麼有些圖片外連就會死圖？從 referer 說起

作者：解凍豬腳│2020-10-18 06:27:44│巴幣：1,164│人氣：4725
　
　　今天來講點不那麼複雜的東西吧。

　　上次曾經在 IP logger 的介紹文提過，我們在瀏覽網站或是圖片的時候，瀏覽器通常會在 header 裡面附帶一些使用者的資訊，隨著連線請求傳到對方的伺服器那邊去，這些資訊就至少包括作業系統和瀏覽器版本（附在 header 裡面的 user-agent 欄位）。



。關於 HTTP 連線請求的 header

　　實際上，header 裡面還有一個欄位叫做 referer（發音：[rɪˈfəːrə]）。為了讓架設伺服器的網站業者便於分析流量來源，現在的瀏覽器都會透過 referer 欄位傳送來源資訊。

　　什麼意思呢？假設你現在正在瀏覽一個網頁：https://127.0.0.1/index.php

　　然後這個頁面上有一張來自別的網站的圖片：
　　https://192.168.0.1/imgs/mayingjou_eat_banana.jpg

　　這時候，你的瀏覽器為了要讀取這張圖片，因此傳送請求給 192.168.0.1 這個伺服器。當瀏覽器傳送連線請求給它們的時候，就會透過 referer 欄位的資訊順帶告訴伺服器：「嗨！我要讀取你伺服器上面的 /imgs/mayingjou_eat_banana.jpg，還有，我是從 https://127.0.0.1/ 這個網站間接連過來的。」

　　另外一種情況是點擊連結。如果你今天在巴哈姆特點了一條 Facebook 的連結，那你這次傳送給 Facebook 伺服器的連線請求也同樣會附帶 referer 的資訊。

　　也因此，伺服器就可以簡單、快速地透過由使用者傳來的連線請求裡的 referer 資訊，辨認這些流量的來源以決定是否要把圖片資訊回傳給使用者了。

　　如果在瀏覽器使用快捷鍵 F12 顯示開發者工具，然後再隨便進到一個人的小屋，任選一張圖片的連線請求，我們可以看到它的 referer 欄位寫著 https://home.gamer.com.tw/，這個就是瀏覽器自動幫你填上的：





。Referer 的類型

　　綜合上一段講的，referer 可以粗略分為三種類型：
　　1. 來自同一個網站
　　2. 來自不同的網站
　　3. 什麼都沒有

　　來自同一個網站：你從 Pixiv 的網站讀取 Pixiv 圖片空間上的圖片，Pixiv 的圖片空間伺服器就會透過 referer 知道你是從 Pixiv 讀取這張圖片，因此正常顯示：



　　來自不同的網站：你從巴哈姆特的網頁讀取 Pixiv 上的圖片，Pixiv 的圖片伺服器就會透過 referer 知道你是從別的網站讀取這張圖片的，所以它可以選擇不把圖片回傳給你，你讀取不到圖片，那當然就會看到包子（死圖）：



　　什麼都沒有：你打開了一個新的分頁，直接在分頁上面輸入 Pixiv 其中一張作品的圖片連結，所以 referer 的欄位不會被填入任何東西。Pixiv 的圖片伺服器不知道你從哪裡來的，但他們可以藉此推測反正你一定不是從他們網站上面讀取，所以它可以選擇不把圖片回傳給你，一樣死圖：





。為什麼這些網站要做這種篩選機制？

　　具有一定規模但資本又沒有非常大的網站或論壇，通常都會把伺服器交給專業的主機商託管。實際上，這種專業的主機服務並不像你的手機網路一樣隨便就可以無限流量吃到飽，所以這些網站也是需要有一定的手段防止自己的圖片空間被濫用。

　　如果沒有這種篩選機制的話，你把一堆圖片上傳到論壇，直接把那論壇當成你的個人圖片空間來使用（甚至丟到其他瀏覽量很大的網站上），想見這論壇的伺服器就會為了一些根本不屬於他們站上的流量消耗一堆額度。這種做白工還可能耗掉自己大把鈔票的事情，當然沒人會想做。

　　所以你才會看到有的網站會防止外連。

　　有的網站只會封鎖「來自不同網站」的連線請求，不會封鎖「referer 欄位什麼都沒有」的連線請求，所以當你在網路上遇到防外連的包子圖，只要把這個網址複製起來、打開新分頁、貼上網址、Ctrl+F5（完整重新整理）就有機會可以讀到圖片了。

　　而 Pixiv 算是 referer 檢查機制比較嚴格的網站。它們的圖片空間只接受 referer 欄位內容為 pixiv.net 或 i.pximg.net 的連線請求。



。遇到 referer 檢查機制的解法

　　不過，referer 這個欄位的內容既然是由發送連線請求的使用者決定的，那使用者當然也可以偽造它。我們可以使用 Postman 這套專門用來產生 HTTP 連線請求的軟體，將 referer 欄位填入 https://i.pximg.net/ 或者是 https://pixiv.net/ 來讓 Pixiv 的圖片伺服器以為我們是從 Pixiv 上面讀取這張圖片：



　　從上圖可以看到伺服器乖乖地把圖片內容傳回來了。

　　網路上也有人特地為了 Pixiv 架設專門用來間接讀取 Pixiv 上面的作品圖片的服務（畢竟這篇的重點是在技術原理，服務的相關資訊就不詳加介紹了），這種服務做的事情就是替大家自訂 referer 以後向 Pixiv 讀取圖片，這樣的服務就是「反向代理」的一種，感覺起來有點像是用 VPN 去連某些有限制的網站那種概念。

　　當然如果 Pixiv 官方想的話，還可以再加上「登入後才能讀取圖片」的過濾手段，這樣就能夠避免有人單純用竄改 referer 的方式來突破瀏覽限制，只是他們沒有做得這麼絕而已。



。在巴哈姆特發生過的 Imgur 封鎖事件

　　其實五年前（2015）就曾經發生過 Imgur 針對來自巴哈姆特網域的大規模封鎖事件。

　　因為長期以來太多巴友用 Imgur 放一些很母湯的圖片（違反 Imgur 的服務條款），然後又普遍把它們放在小屋裡面，所以 Imgur 官方乾脆把 referer 來自巴哈姆特的流量通通都封鎖掉——這樣一來只要從巴哈姆特看 Imgur 的圖片就會死圖，也就能間接減少後續巴哈姆特使用者把圖片上傳到 Imgur 的意願——該次封鎖的網域包括巴哈的小屋、簽名檔、手機版。

　　這也是為什麼後來小屋布景不再能引用 Imgur 圖片當作素材的原因。

　　當時經過站方和 Imgur 官方的一番交涉，Imgur 最終恢復了對 home.gamer.com.tw 的封鎖，但至今簽名檔的 gc.bahamut.com.tw 網域仍然沒被他們從黑名單上面去除，所以如果你把 Imgur 的圖片放在簽名檔，那是沒辦法正常顯示的。

　　Referer 的作用大致上是這樣。不過，既然這些網站會選擇實裝 referer 的篩選機制，那也就代表了他們有這樣的需求。即使瞭解了技術原理，下次當我們遇到防止外連的圖片空間時，還是老老實實地找個專門的圖片空間服務來放圖吧——畢竟，別人的錢也是錢。
　
喜歡79 收藏 14 引用 留言 推上首頁 檢舉
引用網址：https://home.gamer.com.tw/TrackBack.php?sn=4952096
All rights reserved. 版權所有，保留一切權利

相關創作

同標籤作品搜尋：Imgur|Pixiv|圖片

2D轉3D導入Keyshot渲染
Imgur介紹、插件教學
開始用圖床
▶Pixiv｜基本使用說明①
【分享】GIF圖片空間

留言共 14 篇留言

我只是路過的蘿莉控：
登入pixiv或打開pixiv其實也沒特別困難w
為什麼需要特地外連www

10-18 06:54

解凍豬腳：
不是這個問題，有的時候你可能會在別的論壇上看到好笑的圖，當下想要直接轉貼，那你可能就會直接複製它的網址，然後轉貼到別的論壇上，這樣的行為就是外連了10-18 06:56
MR-acetyl：
心得：好險Imgur沒鎖Discord

10-18 09:30

skysumbra：
封面縮圖也挑的太有趣味了吧

10-18 10:45

解凍豬腳：
不知道為什麼馬英九的圖很好用 [e20]10-18 18:12
下午梅克：
優質

10-18 12:11

『　　』：
https://truth.bahamut.com.tw/s01/201905/356d47d467e964440b5120941e8dc8ff.PNG?w=300

10-18 12:40

葉卡兄弟滑起來：
豬腳是讀資工ㄇ？

10-18 13:11

解凍豬腳：
資管10-18 18:21
七星劍：
冷凍豬腳大哥哥上面文章提到的Postman這套專門用來產生HTTP連線請求的軟體 看到的圖片檔案 當中的檔案資訊是否跟存放圖片檔案的網站上面的原圖片相符合 然後僅僅是將referer欄位填入存放圖片的網站網址而已 我想起以前看網上的像是VB程式設計裡面的教學 程式介面的部分有很多的像是選黑紅白藍黃的顏色或者文字的可以設置的選項 那我簡單問起來嘍 可否說一下上面文章說到的這個程式以外 自己家中的桌上用電腦可否手動將referer欄位填入網站網址呢 我是指像上面文章提到的網頁按進去F12這類的可否回應我的這一種猜想到的問題。

10-18 14:24

解凍豬腳：
一般來說得到的檔案跟上面存放的檔案是符合的，除非這個伺服器基於安全考量而把圖片處理過

至於用瀏覽器自訂 referer 應該可以用 JavaScript 來做，可以 Google 看看：javascript send request with custom referer10-18 23:10
七星劍：
是解凍豬腳 我打錯嘍

10-18 14:25

Tathlum：
增廣見聞 原來也是錢的問題

10-18 19:02

AkagiYoukai：
難怪之前簽名檔怎樣都弄不出來

10-19 03:06

汐鹿生：
1.想問為什麼巴哈不用imgur的api去存圖，隔壁Dcard圖床片都是用imgur去弄
2.Imgur服務有規定不能貼r18的圖嗎?就算是設私人 當成雲端備份圖床這樣

07-23 21:02

解凍豬腳：
不知道你是不是指 Dcard 把 imgur 域名強轉成 imgur.dcard.tw 的做法，這可能是透過一個中介伺服器把 referer 去除掉來避免因為用量太大（或違規內容太多）而被 Imgur 封鎖的措施，又或者 Dcard 希望能夠透過攔截流量來統計瀏覽次數的資訊

Imgur 本身不是完全禁止露點內容，勾選 Mature (mature content) 就可以了，但仍然要遵守他們的社群守則：https://imgur.com/tos

我曾經有少數 Imgur 上面的圖因為不知道什麼原因死了，所以不是很確定他們會不會自動掃，重要的圖片我個人不建議用 Imgur 來存07-23 22:50
汐鹿生：
看了Stackflow的圖片好像也是這樣 就是豬腳大大講的反向代理吧 這樣看起來Dcard改referer好像就沒事 不然西斯版NSFW的圖片和現在圖片訪問的流量早就被鎖了吧? 這樣巴哈怎麼不也弄一個？

07-23 23:27

解凍豬腳：
巴哈可能有自己的考量吧，我不是巴哈工程師，其實我也不知道 [e6] 07-23 23:28
YaMao薯叔：
感謝，歷史總是驚人的相似，2023/5/15 又發生了大規模圖片失效，實屬無奈......，不過還好的是下午就恢復了。

05-15 23:25

古狐：
感謝大大的解說，也為我解惑我兩年前發現的無法顯示pixiv圖片的現象
題外話，大大提到的Postman軟體，我以前學校上的課是用Burp Suite Community Edition，個人覺得功能強大更多喔

08-19 05:44

我要留言提醒：您尚未登入，請先登入再留言

79喜歡★johnny860726 可決定是否刪除您的留言，請勿發表違反站規文字。

前一篇：[達人專欄] 微分的運算... 後一篇：[達人專欄] 微分的微分...

追蹤私訊切換新版閱覽

作品資料夾

－－－－－－－－－－－－－－－－－－ (0)

豬腳生活 (1)
└日常雜談、巴哈大小事 (193)
└煞氣a國中生 (7)
└高中生活日誌 (55)
└大學生活日誌 (34)
└冬令營回憶錄 (19)
└也許藏有一些小祕密吧？ (3)
└各式各樣的開箱文 (11)
└貓科動物時間 (15)

－－－－－－－－－－－－－－－－－－ (0)

繪圖創作 (1)
└電繪插圖、草稿 (199)
└短篇漫畫、單幅標語 (61)
└上課太無聊的手繪塗鴉 (8)
└不知道該怎麼分類的綜合作品 (18)

文字創作 (1)
└草莓兵的國軍紀實 (14)
└我與らい的點點滴滴 (12)
└那些榮耀的時刻與心跳加速的瞬間 (60)
└有感而發的隨筆之作、無法分類的短文 (17)

－－－－－－－－－－－－－－－－－－ (0)

語言學習 (1)
└日語：天気がいいから (5)
└粵語：唔好再淨係識講粗口喇 (6)
└英語：Hey, you! (1)

程式設計及電腦網路 (1)
└系列文：跟著豬腳 C 起來 (10)
└系列文：論壇網站運作原理 (3)
└Go（Golang） (11)
└Ruby / RGSS (7)
└Visual Basic (13)
└JavaScript (1)
└各種原理 (17)

思想：多思考一下，世界會更不一樣 (1)
└網路經驗、社會觀察 (23)
└檸檬庫 (21)

數學：我來拯救你的期中考了 (1)
└各類基礎觀念 (5)
└國中生也能懂的微積分 (9)
└微分方程 (0)

小說：用筆鋒劃出新世界的入口 (1)

繪圖：我也想畫出私巴拉西的美圖 (10)

－－－－－－－－－－－－－－－－－－ (0)

施工中 (22)

不堪回首的痕跡、雜物堆放 (31)

－－－－－－－－－－－－－－－－－－ (0)

未分類 (1)

cwt12345 給 可以幫遊戲Steam評論：
復甦之島:愛與勝利，在Steam販售4/28前有10%折扣。這是款獸娘黃油看更多我要大聲說昨天21:13


face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準，可能無法使用新的應用程式來呈現網站內容，在瀏覽器支援度及網站安全性的雙重考量下，為了讓巴友們有更好的使用體驗，巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特：
。Google Chrome（推薦）
。Mozilla Firefox
。Microsoft Edge（Windows10以上的作業系統版本才可使用）

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營，請將 gamer.com.tw 加入廣告阻擋工具的白名單中，謝謝 !【教學】