如何使用無 Cookie 域:完整指南

已發表: 2023-01-03

您的網站是否遭受性能低下和網絡流量高的困擾? 在 cookie 通常是罪魁禍首的地方,一種有效的解決方案是使用無 cookie 的域。

儘管 cookie 是我們在線體驗的主要基石之一,但它們並不總是像名字所暗示的那樣美味。 除了涉及第三方 cookie 的隱私和安全問題外,自動附加到您網站圖像和其他靜態內容的 cookie 會對頁面性能產生嚴重影響。

值得慶幸的是,可以通過使用無 cookie 域來減輕負擔(在本例中為死 cookie)。 在本完整指南中,我們將回顧無 cookie 域的基礎知識、它們為何如此有用,以及如何配置您的 WordPress 站點以使用它們。

但首先,讓我們深入了解數字 cookie 罐,仔細研究域如何使用 cookie——無論好壞。

什麼是無 Cookie 域?

無 Cookie 域是網站的一部分,不會向用戶的瀏覽器發送 Cookie。

但是為什麼不一直發送 cookie 呢? 畢竟,給用戶盡可能多的 cookie 不是很有禮貌嗎?

不必要。 當我們談論無 cookie 域時,我們當然指的是 HTTP cookie。 與我們最喜歡的烘焙食品不同,HTTP cookie 是網站發送到用戶瀏覽器的小數據包。 雖然不是很好吃,但它們對於允許網站在用戶下次訪問時“記住”用戶非常有用。

但是,就像實際的 cookie 一樣,您不想提供太多的 HTTP cookie。 正如我們很快就會看到的,訪問者喜歡吃一些餅乾——但是超過他們需要的東西會讓他們感到呆滯和臃腫。

您的網站是否遭受性能低下和網絡流量高的困擾? 無 Cookie 域可能是解決方案點擊推

什麼是 HTTP Cookie?

HTTP cookie 在網絡上無處不在。

每當您訪問網站時,該網站很有可能會要求您使用瀏覽器存儲 cookie。 除了有關網站本身和您訪問過的頁面的信息外,cookie 還包括與您和您的瀏覽器相關聯的個人標識符。 該標識符允許網站“記住”您是否已經訪​​問過該頁面。

讓我們仔細看看這種餅乾交換是如何進行的(劇透警告:沒有任何迷人的柳條籃子或女童子軍參與其中)。

網站如何將 HTTP cookie 發送到用戶的網絡瀏覽器
網站如何向用戶的網絡瀏覽器發送 HTTP cookie

如上圖所示,交換可以分為三個步驟:

  1. 您的瀏覽器請求網頁。 當您在瀏覽器的地址欄中輸入地址(例如域 URL,如“kinsta.com”)或單擊網絡鏈接時,您的瀏覽器會生成一個 HTTP 請求,告訴網站它想要查看該頁面。 此請求被發送到託管網站及其頁面的網絡服務器。
  2. Web 服務器發送頁面和 cookie。 收到您的請求後,網絡服務器會發回請求的頁面和包含特定信息的 cookie。 正如我們之前提到的,此 cookie 幾乎總是包含您和您的瀏覽器的個人標識符。
  3. 瀏覽器從同一服務器請求另一個頁面。 現在假設您單擊指向網站上另一個頁面的鏈接,例如電子商務網站上的“商店”或“關於我們”。 在這裡,您的瀏覽器向網絡服務器發送另一個請求和它最初提供的 cookie。 當 Web 服務器收到此請求時,它會看到之前發送的 cookie 並記住您已經訪問過。 有了這些信息,網絡服務器就可以提供更加個性化的體驗,例如維護活動登錄或購物車中的項目。

還有用於不同目的的不同 cookie。 在上面的示例中,參與會話管理的網絡服務器維護您的登錄名或購物車項目——換句話說,就是您在他們網站上的個人會話。 同樣,cookie 也可用於提供個性化體驗,例如顯示最近的訂單、瀏覽過的商品,甚至是有針對性的廣告。

雖然無論走到哪裡都能得到餅乾聽起來不錯,但這並不是它吹噓的一切。 正如我們將在下一節中看到的那樣,網站實際上可能會提供過多的 cookie——其中一些很多人寧願不“吃掉”。

域如何使用 HTTP Cookie

儘管個人標識符是 HTTP cookie 的一個非常重要的用途,但它們並不是唯一的用途。 事實上,cookie 可用於多種目的,以提供更加個性化的網絡體驗、提供有針對性的內容等。

如何使用 cookie 侵犯隱私
如何使用 cookie 侵犯隱私

我們已經介紹了網站和瀏覽器如何交換 HTTP cookie 以“記住”您。 雖然這有助於維護登錄會話和顯示購物車項目,但 cookie 也可用於更邪惡(或徹底煩人)的目的。

以下是域使用 HTTP cookie 的一些最常見方式。

  • 會話管理。 你現在已經知道這個了。 會話管理通常被認為是 HTTP cookie 最“良性”的用途,因為它的唯一目的是提供一致的用戶體驗,幫助用戶避免重複某些操作。 雖然看到以前的活動可能會給某些用戶帶來隱私問題,但它相對無害。 當使用 cookie 進行跟踪時,真正的隱私問題就會出現,我們將在稍後介紹。
  • 個性化。 會話管理還可用於根據用戶偏好和活動對網頁進行個性化設置。 例如,在選擇了他們選擇的語言後,用戶將能夠在隨後的訪問中以相同的語言查看網站,而不必每次都更改它。 Cookie 還可以讓網站適應不同網絡瀏覽器的特定要求。
  • 追踪。 餅乾也有爭議的一面。 由於您的瀏覽器存儲了網站提供給您的 cookie,因此這些 cookie 可用於在您上網的任何地方跟踪您。 例如,您可能會訪問一個網站,該網站會為您的瀏覽器提供一個跟踪 cookie,讓網絡上的附屬廣告商知道您訪問了他們的頁面。 當廣告商注意到此 cookie 時,他們可以針對原始網站顯示有針對性的廣告,甚至可以將其用作網絡攻擊的載體。 在任何情況下,跟踪 cookie 都會讓您感覺自己被“跟踪”——這伴隨著一系列道德和隱私問題。

值得慶幸的是,大多數 HTTP cookie 用於會話管理和個性化。 然而,即使是最無害的 cookie 也會引起問題。

到目前為止,我們已經探討了一個頁面發送一個 cookie 的想法。 實際上,一個頁面通常會發送多個 cookie,通常每個頁面元素一個——HTML、圖像文件等。 雖然其中一些 cookie 是會話管理和個性化所必需的,但其中許多不是。

因此,可能會發送過多的 cookie,這會導致一些問題。 我們將在下一節討論這些問題。

吃太多餅乾

與大多數文檔不同,網頁是賦予它們形式、結構和意義的各種元素的集合。 這些元素中的每一個都可以有自己的 cookie。

我們可能以 .pdf 或 .docx 格式查看的常規文檔可能看起來像是文本和圖像的單一“組合”,而網頁是由許多獨立的小部分構建的。

HTML、CSS 和 JavaScript 是大多數網站的主要組成部分
HTML、CSS 和 JavaScript 是大多數網站的主要組成部分

例如,當您請求網頁時,您實際上是在請求單獨的頁面組件,例如 HTML(結構)、CSS(樣式/格式)、JavaScript(交互性)和媒體(例如圖像)。 因此,當您的瀏覽器接收到一個網頁時,它實際上是在接收並重新組合這些組件以在您的屏幕上顯示完整的頁面。

如果網絡服務器也發送 cookie,它可能會在此過程中自動發送一個包含每個元素的 cookie。 對於只有幾張圖片的簡單網頁來說,這可能意義不大,但如果網頁有數十個甚至數百個不同的組件——並且為每個組件發送一個 cookie,它很快就會變得不堪重負。

就像在現實生活中吃太多 cookie 一樣,發送和接收過多的 HTTP cookie 會導致性能低下。 由於發送額外的數據需要額外的時間和資源,因此將 cookie 與每個元素一起發送很容易消耗大量的網絡資源。

領域飲食:無餅乾

值得慶幸的是,發送過多 cookie 的解決方案使用了一個現實世界的類比:要提高性能,只需吃(讀:發送)更少的 cookie。

但是我們應該放棄哪些 cookie? 在大多數情況下,最佳做法是從頁面上的任何靜態元素中刪除 cookie。

靜態元素是那些您不希望隨著用戶行為而改變的元素,例如靜態圖像或靜態文件,如 CSS 文件。 因此,它們不需要附加 cookie,這使得刪除它們成為減少網絡負載和提高性能的最佳方法之一。

當然,刪除 cookie 並不像取消選中“cookie”複選框那麼簡單。

相反,Web 服務器使用無 cookie 域來分發沒有 cookie 的靜態內容與有 cookie 的內容。 無 cookie 域通常是一個單獨的域(例如子域或 FQDN,如“ static.kinsta.com ”或“ kinsta.com ”)。

顯示子域的 URL 結構
顯示子域的 URL 結構

值得慶幸的是,當您使用正確的工具時,使用無 cookie 域並不是很難——設置子域並不是唯一的方法。

但在我們動手之前,讓我們探討一下使用無 cookie 域的一些最大好處,以及這會對您的網站(和您的預算)產生多大的影響。

為什麼使用無 Cookie 域?

刪除多餘的 cookie 聽起來像是一個小動作——坦率地說,確實如此。

然而,這個小動作帶來了一些相當大的好處。 通過僅發送您需要的 cookie,您將減輕網絡流量並獲得下面發現的許多其他好處 — 其中一些與性能完全無關。

減少不必要的網絡流量

使用無 cookie 域的大部分好處源於減少不必要的 cookie 流量的網絡負載。

正如我們之前所述,向訪問者發送頁面元素需要一定數量的網絡資源。 除了元素本身之外,每個元素(甚至同一元素的多個部分)都與包含路由信息的響應標頭以及其他元素(例如 cookie)一起發送。

儘管 cookie 是相對較小的數據文件,但每次頁面請求都必鬚髮送大量 cookie 會很快累加起來。 結果,用戶不得不等待更長的時間來加載頁面,因為您可憐的 Web 主機不堪重負(並且因此超出了預算)。

但是,如果您使用無 cookie 的域,您將消除大部分因發送不必要的 cookie 而造成的大量訪問。

提高網站性能

正如您想像的那樣,通過減少 cookie 來減少網絡負載會對加載時間和網站性能產生重大影響。

由於每次頁麵點擊都是對 Web 服務器的單獨請求,因此用戶可能會發現自己等待很長時間只是為了執行基本導航(主頁>關於我們>商店等)。 雖然頁面元素和 cookie 可能會在第一次加載後被緩存和重用,但如果頁面發生變化或用戶更深入地瀏覽您的網站,這仍然會出現問題。

有利於 SEO 和用戶體驗

通過減少不必要的流量來提高網站性能,您的網站還可能會在搜索引擎優化 (SEO) 以及客戶和用戶體驗方面受益。

客戶體驗是最明顯的好處:加載時間更短,用戶可以更快地訪問他們想要的內容。 因此,他們將更有可能瀏覽您的網站(以及您的產品或服務),而不太可能因沮喪而點擊離開。

同樣的好處也適用於 SEO。 雖然頁面加載時間不會直接影響 SEO,但您的跳出率(點擊離開您頁面的訪問者的百分比)肯定會影響。

購物者不想等待頁面加載太久
頁面加載速度

根據 Unbounce 的一份報告,如果需要等待四秒或更長時間才能加載頁面,四分之三的托運人將放棄頁面。

這意味著即使刪除不必要的 cookie 僅將加載時間縮短一秒鐘,​​您仍然會看到跳出率大幅減少,從而提高搜索排名。

降低託管成本

網絡流量最終會花費網絡託管費用。

這意味著如果您發送的 cookie 比您需要的多,您還要支付更多的網絡託管費用。 如果 cookie 影響頁面性能,損害會加倍:除了為更多流量付費外,由於加載時間緩慢導致跳出率增加,您還需要支付更多費用才能獲得相同的回報。

值得慶幸的是,像 Kinsta 這樣的託管服務可以幫助您充分利用您的頁面訪問量。 Kinsta 提供 APM 工具和其他功能來幫助您充分利用您的 WordPress 網站。

無 Cookie 未來準備

最後,雖然現在可能不會帶來直接好處,但提供無 cookie 內容將幫助您更好地為無 cookie 的未來做好準備。

隨著隱私要求(如 GDPR)對 cookie 的爭議不斷增加,許多主要搜索引擎和技術公司正在尋找完全消除 cookie 的方法。 雖然 cookie 可能不會在一段時間內消失,但它們最終可能會消失——而且您越早準備好,過渡就會越容易。

使用無 Cookie 域的方法

正如我們之前提到的,無 cookie 域的總體思路是在不提供 cookie 的情況下提供靜態內容。 雖然創建一個單獨的靜態域或子域是最直接的方法,但也可以使用 CDN 和一些 WordPress 技巧。

創建一個單獨的、無 Cookie 的域

使用此方法,您將創建一個單獨的域來託管網站的靜態組件,例如圖像和 CSS。

雖然您可以註冊一個完全獨立的域名,但創建現有域名的子域通常更容易且更具成本效益。 大多數無 cookie 域僅使用靜態前綴(例如“ static.yourdomain.com ”)作為其子域。

請注意,這僅在您域的“www”版本(例如,“ www.yourdomain.com ”)是您網站根文件中的根域時才有效。

要使子域無 cookie,您通常必須使用特殊代碼直接查找和編輯 .htaccess 文件。 然而,正如我們稍後將看到的,簡單地重新配置您的 WordPress 站點或使用插件要容易得多。

無論您如何配置無 cookie 子域,您都可以上傳靜態組件,例如 CSS 組件、圖像、文本和 JavaScript。

使用內容分發網絡 (CDN)

使用內容分發網絡或 CDN 是使用無 cookie 域的一種極其方便的方式。

在這裡,您不必創建單獨的子域和編輯配置文件,只需告訴您的 CDN 忽略並從靜態組件的響應標頭中刪除 cookie。 這聽起來可能有點複雜,但它實際上是許多 CDN 中的一個簡單功能。

請注意,並非每個 CDN 都提供此功能。 因此,通常最好更改您網站的配置,除非您已經在使用允許您禁用 cookie 的 CDN。

重新配置您的 WordPress 網站

如果您使用的是 WordPress,那麼您很幸運:指定無 cookie 域所需要做的就是更新 wp-config.php 文件中的幾行。 向前跳至下一節(配置 WordPress 以使用無 Cookie 域)以獲取完整說明。

使用 WordPress 插件

另一個簡單的 WordPress 選項是使用插件來創建 WordPress 網站的靜態版本。

一個流行的插件是 WP2Static(字面意思是“WordPress-to-Static”)。 安裝插件後,只需在您的 WordPress 儀表板中打開它並配置設置以將您的網站導出為靜態版本:

在 WP2Static 中創建 WordPress 站點的靜態版本
WP2靜態

配置 WordPress 以使用無 Cookie 域

如上所述,WordPress 提供了一種實現無 cookie 域的簡單方法。 該過程歸結為幾個簡單的步驟:

  1. 添加備用子域和關聯的 DNS
  2. 告訴 WordPress 哪個域將提供靜態資產
  3. 更新現有的 WordPress 數據庫記錄以反映這個新地址

Kinsta 客戶可以使用 MyKinsta 儀表板來完成其中一些任務。 許多其他 WordPress 用戶將能夠在 cPanel 中執行相同的操作。

我們將在下面介紹兩者。

使用 MyKinsta 設置無 Cookie 域

Kinsta 客戶可以將子域(或完全不同的域)與 MyKinsta 儀表板中的 WordPress 實例相關聯。 許多客戶還將使用 MyKinsta 的工具為這些域配置 DNS。

在此示例中,我們將在static.example.com為我們已經在www.example.com上運行的網站創建一個無 cookie 域。

步驟 1. 在 MyKinsta 中創建子域

如果您最初在 Kinsta 上使用通配符選項及其域名(例如: *.example.com )建立了您的 WordPress 站點,那麼您已經設置為支持任何子域名。 如果沒有,您可以為無 cookie 內容添加新域,如下所示:

  • 在左側菜單中選擇WordPress 站點
  • 單擊您的 WordPress 站點的名稱。
  • 在左側菜單中選擇
  • 單擊添加域按鈕。
屏幕截圖:在 MyKinsta 中添加另一個域。
在 MyKinsta 中添加子域。

在以下對話框中:

為停機和 WordPress 問題苦苦掙扎? Kinsta 是旨在節省您時間的託管解決方案! 查看我們的功能
  • 輸入您的無 cookie 域的名稱。
  • 單擊添加域按鈕。
屏幕截圖:在 MyKinsta 中鍵入新域名。
在 MyKinsta 中指定新的子域。

接下來,您的新靜態域將需要一個指向您現有網站的 DNS 記錄。 如果您通過第三方提供商為您的域管理 DNS,您將使用他們的工具來執行此操作。 如果您的 DNS 由我們提供,請像這樣在 MyKinsta 中配置您的新域:

  • 在 MyKinta 主頁的左側菜單中選擇DNS
  • DNS 管理頁面上,向下滾動到DNS 記錄塊,然後單擊添加 DNS 記錄按鈕。

我們建議將您的新子域作為 CNAME 記錄添加到 DNS,這樣您就可以僅依賴二級域名來關聯 IP 地址。 下面,我們為指向example.com靜態添加 CNAME 記錄:

屏幕截圖:在 MyKinsta 中創建 DNS 記錄。
在 MyKinsta DNS 管理中創建 CNAME 記錄。

第 2 步。在您的靜態子域上禁用 Cookie

現在我們將編輯您的 WordPress 站點的wp-config.php文件,以便從“靜態”域提供wp-content文件夾中的資產,並且僅通過“www”地址提供 cookie。

大多數 Kinsta 客戶將使用 FTP/SFTP 客戶端登錄到他們的 WordPress 站點並將wp-config.php下載到他們的桌面以進行編輯:

屏幕截圖:使用 SFTP 客戶端下載 wp-config.php。
將 wp-config.php 文件下載到桌面。

使用文本編輯器將以下行添加到wp-config.php文件(將示例域替換為您自己的域):

 define("WP_CONTENT_URL", "https://static.example.com/wp-content"); define("COOKIE_DOMAIN", "www.example.com");

保存文件後,將其上傳到您的 WordPress 站點,替換之前的版本。

步驟 3. 將現有資產重定向到子域

上述步驟將允許在瀏覽器從“www”地址加載頁面和博客文章等內容時分發 cookie,但會導致媒體上傳等內容以及主題中的 JavaScript、CSS 和字體等資產與“靜態”相關聯“ 領域。

但是,您的網站可能已經包含指向位於“www”地址的這些資產的鏈接的內容。 您可以通過在 WordPress 數據庫本身中進行一些搜索和替換來清理它。

在使用數據庫之前,請始終備份您的 WordPress 站點。 完成後:

  • 在 MyKinsta 儀表板的左側菜單中選擇WordPress 站點
  • 單擊您的 WordPress 站點的名稱。
  • 在左側菜單中選擇
  • 在“站點信息”頁面上,向下滾動到“數據庫訪問”塊。 (如果需要,您可以在此處複製數據庫用戶名和密碼信息。)
  • 單擊打開 phpMyAdmin鏈接。
  • 登錄到您的 WordPress 數據庫。
  • 單擊SQL選項卡。
屏幕截圖:使用 phpMyAdmin 更新 WordPress 數據庫中的內容。
運行 SQL 查詢以更新 WordPress 內容中的資產鏈接。

運行以下命令以確保您現有帖子中的任何資產鏈接都指向您的無 cookie 子域(再次確保將域替換為您自己的域):

 UPDATE wp_posts SET post_content = REPLACE(post_content, 'www.example.com/wp-content/', ' static.example.com/wp-content/')

您現在已經在 MyKinsta 的幫助下成功地在 WordPress 中配置了一個無 cookie 域。 使用此域來託管您不想為其發送 WordPress cookie 的任何靜態內容,並將您的常規域用於其他所有內容。

使用 cPanel 設置無 Cookie 域

以下是使用 cPanel 或流行的 cPanel 替代品之一完成我們在 MyKinsta 中所做的上述操作的步驟。

步驟 1. 在 cPanel 中創建子域

導航到 cPanel 主頁的部分。 在子域工具中,只需創建一個連接到當前 WordPress 站點頂級域的子域。

這些設置可以在下面看到創建子域static.example.com

在 cPanel 中創建子域
在 cPanel 中創建子域

步驟 2. 在 cPanel 中將子域配置為靜態

隨著您的新靜態子域準備就緒,是時候通過在 WordPress 中提供靜態內容來使其名副其實了。

我們將通過編輯您的 WordPress 站點的wp-config.php文件來完成此操作。 訪問此文件的最簡單方法是使用 cPanel 的文件管理器工具。

文件管理器中,導航到您網站的public_html 文件夾並選擇wp-config.php (1)。 然後,選擇編輯選項 (2) 以編輯文件。

在 cPanel 文件管理器工具中找到 wp-config.php 文件
找到 wp-config.php 文件

wp-config.php文件中,只需添加以下行(確保將域替換為您自己的域!):

 define("WP_CONTENT_URL", "https://static.example.com/wp-content"); define("COOKIE_DOMAIN", "www.example.com");

單擊“保存更改”。

第 3 步。將現有帖子重定向到子域

最後,您需要將現有帖子重定向到新的靜態子域。 但首先,請務必備份您的 WordPress 網站,以防萬一之後無法正常運行。

在 cPanel 的數據庫部分,打開PhpMySQL工具。 選擇您站點的數據庫,然後選擇它的_posts表。

單擊_posts表的SQL選項卡。 運行以下命令以驗證您的帖子 URL 是否定向到您的無 cookie 子域(再次確保將域替換為您自己的域):

 UPDATE wp_posts SET post_content = REPLACE(post_content, 'www.example.com/wp-content/', ' static.example.com/wp-content/') 
將現有帖子重定向到新的靜態子域
將現有帖子重定向到新的靜態子域

就是這樣! 您現在已經在 cPanel 的幫助下在 WordPress 中設置了一個無 cookie 域。 將無 cookie 域用於圖像、CSS、JavaScript 和字體等靜態內容,同時允許在您網站的主域上使用 cookie。

無 Cookie 域可以幫助您減輕網絡流量……以及更多。 繼續閱讀以了解更多信息️ 點擊鳴叫

概括

使用無 cookie 域是提高站點性能、降低託管成本甚至增強客戶體驗和 SEO 的一種非常有效的方法。

正如我們所見,在 WordPress 中設置無 cookie 域是有益的。 但是,只有像 Kinsta 這樣的託管 WordPress 主機才能充分利用這些優勢。

借助用於刪除 set-cookie 標頭的便捷工具和直接數據庫訪問以將帖子重定向到靜態子域,使用無 cookie 域從未如此簡單。 Kinsta 的 APM 工具和其他性能監控功能也可以幫助您跟踪結果。

欲了解更多信息並親自查看 Kinsta,請立即聯繫我們或安排免費演示。