網路廣告商的畫素追蹤是如何工作的？

Julia Evans發表於2019-12-29

昨天，我和一名記者談到了一個問題：廣告商是如何在網際網路上對人們進行追蹤的？我們津津有味地檢視了 Firefox 的開發者工具（雖然我不是一個網際網路隱私專家，但至少還會使用開發者工具中的“network”標籤頁），從中我終於弄明白畫素追蹤tracking pixels在實際中是如何工作的了。

問題：Facebook 怎麼知道你逛了 Old Navy？

我時常聽人們說起這種有些詭異的上網經歷：你線上上瀏覽了一個商品，一天之後，竟然看到了同一款靴子（或者是別的什麼你當時瀏覽的商品）的廣告。這就是所謂的“再營銷”，但它到底是如何實現的呢？

在本文中，我們來進行一個小實驗，看看 Facebook 究竟是怎麼知道你線上上瀏覽了什麼商品的。這裡使用 Facebook 作為示例，只是因為很容易找到使用了 Facebook 畫素追蹤技術的網站；其實，幾乎所有網際網路廣告公司都會使用類似的追蹤技術。

準備：允許第三方追蹤器，同時關閉廣告攔截器

我使用的瀏覽器是 Firefox，但是 Firefox 預設攔截了很多這種型別的追蹤，所以需要修改 Firefox 的隱私設定，才能讓這種追蹤生效。

首先，我將隱私設定從預設設定（截圖）修改為允許第三方追蹤器的個性化設定（截圖），然後禁用了一些平時執行的隱私保護擴充套件。

畫素追蹤：關鍵不在於 gif，而在於請求引數

畫素追蹤是網站用來追蹤你的一個 1x1 大小的 gif。就其本身而言，一個小小的 1x1 gif 顯然起不到什麼作用。那麼，畫素追蹤到底是如何進行追蹤的？其中涉及兩個方面：

通過使用畫素追蹤上的請求引數，網站可以新增額外的資訊，比如你正在訪問的頁面。這樣一來，請求的就不是 https://www.facebook.com/tr/（這個連結是一個 44 位元組大小的 1x1 gif），而是 https://www.facebook.com/tr/?the_website_you're_on。（郵件營銷人員會使用類似的技巧，通過為畫素追蹤指定一個獨特的 URL，弄清楚你是否開啟了某一封郵件。）
在傳送該請求的同時，還傳送了相應的 cookie。這樣一來廣告商就可以知道，訪問 oldnavy.com 的這個人和在同一臺電腦上使用 Facebook 的是同一個人。

Old Navy 網站上的 Facebook 畫素追蹤

為了對此進行驗證，我在 Old Navy（GAP 旗下的一個服裝品牌）網站上瀏覽了一個商品，相應的 URL 是 https://oldnavy.gap.com/browse/product.do?pid=504753002&cid=1125694&pcid=1135640&vid=1&grid=pds_0_109_1（這是一件“男款短絨格子花呢大衣”）。

在我瀏覽這個商品的同時，頁面上執行的 Javascript（用的應該是這段程式碼）向 facebook.com 傳送了一個請求。在開發者工具中，該請求看上去是這樣的：（我遮蔽了大部分 cookie 值，因為其中有一些是我的登入 cookie）

下面對其進行拆解分析：

我的瀏覽器向如下 URL 傳送了一個請求；

https://www.facebook.com/tr/?id=937725046402747&ev=PageView&dl=https%3A%2F%2Foldnavy.gap.com%2Fbrowse%2Fproduct.do%3Fpid%3D504753002%26cid%3D1125694%26pcid%3Dxxxxxx0%26vid%3D1%26grid%3Dpds_0_109_1%23pdp-page-content&rl=https%3A%2F%2Foldnavy.gap.com%2Fbrowse%2Fcategory.do%3Fcid%3D1135640%26mlink%3D5155%2Cm_mts_a&if=false&ts=1576684838096&sw=1920&sh=1080&v=2.9.15&r=stable&a=tmtealium&ec=0&o=30&fbp=fb.1.1576684798512.1946041422&it=15xxxxxxxxxx4&coo=false&rqm=GET

與該請求同時傳送的，還有一個名為 fr 的 cookie，取值為
```
10oGXEcKfGekg67iy.AWVdJq5MG3VLYaNjz4MTNRaU1zg.Bd-kxt.KU.F36.0.0.Bd-kx6.
```
（估計是我的 Facebook 廣告追蹤 ID）

在所傳送的畫素追蹤查詢字串裡，有三個值得注意的地方：

我當前訪問的頁面：https://oldnavy.gap.com/browse/product.do?pid=504753002&cid=1125694&pcid=1135640&vid=1&grid=pds_0_109_1#pdp-page-content
引導我來到當前頁面的上一級頁面：https://oldnavy.gap.com/browse/category.do?cid=1135640&mlink=5155,m_mts_a；
作為我的身份標識的 cookie：10oGXEcKfGekg67iy.AWVdJq5MG3VLYaNjz4MTNRaU1zg.Bd-kxt.KU.F36.0.0.Bd-kx6.

下面來逛逛 Facebook！

下面來逛逛 Facebook 吧。我之前已經登入了 Facebook，猜猜看，我的瀏覽器傳送給 Facebook 的 cookie 是什麼？

不出所料，正是之前見過的 fr cookie：10oGXEcKfGekg67iy.AWVdJq5MG3VLYaNjz4MTNRaU1zg.Bd-kxt.KU.F36.0.0.Bd-kx6.。Facebook 現在一定知道我（Julia Evans，這個 Facebook 賬號所關聯的人）在幾分鐘之前訪問了 Old Navy 網站，並且瀏覽了“男款短絨格子花呢大衣”，因為他們可以使用這個 cookie 將資料串聯起來。

這裡涉及到的是第三方 cookie

Facebook 用來追蹤我訪問了哪些網站的 cookie，屬於所謂的“第三方 cookie”，因為 Old Navy 的網站使用它為一個第三方（即 facebook.com）確認我的身份。這和用來維持登入狀態的“第一方 cookie”有所不同。

Safari 和 Firefox 預設都會攔截許多第三方 cookie（所以需要更改 Firefox 的隱私設定，才能夠進行這個實驗），而 Chrome 目前並不進行攔截（很可能是因為 Chrome 的所有者正是一個廣告公司）。（LCTT 譯註：Chrome 可以設定阻攔）

網站上的畫素追蹤有很多

如我所料，網站上的畫素追蹤有很多。比如，wrangler.com 在我的瀏覽器里載入了來自不同域的 19 個不同的畫素追蹤。wrangler.com 上的畫素追蹤分別來自：ct.pinterest.com、af.monetate.net、csm.va.us.criteo.net、google-analytics.com、dpm.demdex.net、google.ca、a.tribalfusion.com、data.photorank.me、stats.g.doubleclick.net、vfcorp.dl.sc.omtrdc.net、ib.adnxs.com、idsync.rlcdn.com、p.brsrvr.com，以及 adservice.google.com。

Firefox 貼心地指出，如果使用 Firefox 的標準隱私設定，其中的大部分追蹤器都會被攔截：

瀏覽器的重要性

瀏覽器之所以如此重要，是因為你的瀏覽器最終決定了傳送你的什麼資訊、傳送到哪些網站。Old Navy 網站上的 Javascript 可以請求你的瀏覽器向 Facebook 傳送關於你的追蹤資訊，但瀏覽器可以拒絕執行。瀏覽器的決定可以是：“哈，我知道 facebook.com/tr/ 是一個畫素追蹤，我不想讓我的使用者被追蹤，所以我不會傳送這個請求”。

瀏覽器還可以允許使用者對上述行為進行配置，方法包括更改瀏覽器設定，以及安裝瀏覽器擴充套件（所以才會有如此多的隱私保護擴充套件）。

摸清其中原理，實為一件趣事

在我看來，弄清楚 cookie/畫素追蹤是怎麼用於對你進行追蹤的，實在是一件趣事（儘管有點嚇人）。我之前大概明白其中的道理，但是並沒有親自檢視過畫素追蹤上的 cookie，也沒有看過傳送的查詢引數上究竟包含什麼樣的資訊。

當然，明白了其中的原理，也就更容易降低被追蹤的概率了。

可以採取的措施

為了儘量避免在網際網路上被追蹤，我採取了幾種簡單的措施:

安裝一個廣告攔截器（比如 ublock origin 之類）。廣告攔截器可以針對許多追蹤器的域進行攔截。
使用目前預設隱私保護強度更高的 Firefox/Safari，而不是 Chrome。
使用 Facebook Container 這個 Firefox 擴充套件。該擴充套件針對 Facebook 進一步採取了防止追蹤的措施。

雖然在網際網路上被追蹤的方式還有很多（尤其是在使用手機應用的時候，因為在這種情況下，你沒有和像對瀏覽器一樣的控制程度），但是能夠理解這種追蹤方法的工作原理，稍微減少一些被追蹤的可能性，也總歸是一件好事。