Cookie詳解

Cookie在遠(yuǎn)程瀏覽器端存儲(chǔ)數(shù)據(jù)并以此跟蹤和識(shí)別用戶的機(jī)制。從實(shí)現(xiàn)上說，Cookie是存儲(chǔ)在客戶端上的一小段數(shù)據(jù)，瀏覽器（即客戶端）通過HTTP協(xié)議和服務(wù)器端進(jìn)行Cookie交互。

Cooke獨(dú)立于語言存在，嚴(yán)格地說，Cookie并不是由PHP、Java等語言實(shí)現(xiàn)的，而是由這些語言對Cookie進(jìn)行間接操作，即發(fā)送HTTP指令，瀏覽器收到指令便操作Cookie并返回給服務(wù)器。因此，Cookie是由瀏覽器實(shí)現(xiàn)和管理的。舉例說，PHP并沒有真正設(shè)置過Cookie，只是發(fā)出指令讓瀏覽器來做這件事。PHP中可以使用setcookie() 或 setrawcookie() 函數(shù)設(shè)置Cookie。setcookie()最后一個(gè)參數(shù)HttpOnly設(shè)置了后，JavaScript就無法讀取到這個(gè)Cookie。

設(shè)置Cookie時(shí)需注意：①函數(shù)有返回值，false失敗，true成功，成功僅供參考，不代表客戶端一定能接收到；②PHP設(shè)置的Cookie不能立即生效，要等下一個(gè)頁面才能看到（Cookie從服務(wù)器傳給瀏覽器，下個(gè)頁面瀏覽器才能把設(shè)置的Cookie傳回給服務(wù)器）；如果是JavaScript設(shè)置的，是立即生效的；③Cookie沒有顯示的刪除函數(shù)，可以設(shè)置expire過期時(shí)間，自動(dòng)觸發(fā)瀏覽器的刪除機(jī)制。

Cookie是HTTP頭的一部分，即現(xiàn)發(fā)送或請求Cookie，才是data域；setcookie()等函數(shù)必須在數(shù)據(jù)之前調(diào)用，這和header() 函數(shù)是相同的。不過也可以使用輸出緩沖函數(shù)延遲腳本的輸出，知道設(shè)置好所有Cookie和其他HTTP標(biāo)頭。

Cookie通常用來存儲(chǔ)一些不是很敏感的信息，或者進(jìn)行登錄控制，也可用來記住用戶名、記住免密碼登錄、防止刷票等。每個(gè)域名下允許的Cookie是有限制的，根據(jù)瀏覽器這個(gè)限制也不同。Cookie不是越多越好，它會(huì)增加寬帶，增加流量消耗，所以不要濫用Cookie；不要把Cookie當(dāng)作客戶端的存儲(chǔ)器來用。一個(gè)域名的每個(gè)Cookie限制以4千字節(jié)（KB）鍵值對的形式存儲(chǔ)。

還有一種Cookie是Flash創(chuàng)建的，成為Flash Shard Object，又稱Flash Cookie，即使清空瀏覽器所有隱私數(shù)據(jù)，這類頑固的Cookie還會(huì)存在硬盤上，因?yàn)樗皇蹻lash管理，很多網(wǎng)站采用這種技術(shù)識(shí)別用戶。

Cookie跨域，主要是為了統(tǒng)一應(yīng)用平臺(tái)，實(shí)現(xiàn)單點(diǎn)登錄；需使用P3P協(xié)議（Platform for Privacy Preferences），通過P3P使用戶自己可以指定瀏覽器的隱私策略，達(dá)到存儲(chǔ)第三方Cookie的目的，只需要在響應(yīng)用戶請求時(shí)，在HTTP的頭信息中增加關(guān)于P3P的配置信息就可以了。Cookie跨域涉及兩個(gè)不同的應(yīng)用，習(xí)慣上稱為第一方和第三方。第三方通常是來自別人的廣告、或Iframe別的網(wǎng)站的URL，這些第三方網(wǎng)站可能使用的Cookie。

好，重點(diǎn)給大家介紹vue webpack重寫cookie路徑的方法，具體內(nèi)容如下所示：

webpack提供的反向代理服務(wù)器在開發(fā)階段非常方便，幾行簡單的代碼配置就可以使用反向代理功能，包括路徑重寫、cookie處理等。

項(xiàng)目開發(fā)階段使用的API路徑是 /admin ，部署到線上是 / ，所以在開發(fā)過程中需要在 proxyTable 進(jìn)行反向代理配置，將路徑重寫掉，路徑重寫代碼如下( config/index.js ):

proxyTable: {
  '/admin': {
  target: 'http://127.0.0.1:8080',
  changeOrigin: true,
  pathRewrite: {
   '^/admin': '/admin2'
  },
  }
}

啟動(dòng)項(xiàng)目之后進(jìn)行登錄，此時(shí)API請求成功，但是獲取登錄用戶信息時(shí)發(fā)現(xiàn)cookie沒有帶過去。查看請求發(fā)現(xiàn)登錄請求的 Set-Cookie 響應(yīng)頭中的 Path 是 /admin2 。但是咱們請求的路徑是 /admin ，cookie當(dāng)然不會(huì)生效。

查閱文檔發(fā)現(xiàn)，proxyTable支持 onProxyRes 回調(diào)函數(shù)來自定義響應(yīng)，流程是通過替換后端服務(wù)器設(shè)置的 cookie-path 來進(jìn)行處理，代碼如下：

proxyTable: {
  '/admin': {
  target: 'http://127.0.0.1:8080',
  changeOrigin: true,
  pathRewrite: {
   '^/admin': '/lesson/admin'
  },
  onProxyRes: function (proxyRes, req, res){
   const cookies = proxyRes.headers['set-cookie']
   if (cookies) {
   const newCookies = cookies.map(cookie=> {
    return cookie.replace(/Path=\/admin2/, 'Path=/')
   })
   delete proxyRes.headers['set-cookie']
   proxyRes.headers['set-cookie'] = newCookies
   }
 }
 },
},

重啟webpack之后重新登錄，發(fā)現(xiàn)cookie的路徑已經(jīng)被重寫到 / 了。

總結(jié)

以上所述是小編給大家介紹的vue webpack重寫cookie路徑的方法,希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
如果你覺得本文對你有幫助，歡迎轉(zhuǎn)載，煩請注明出處，謝謝！

最新評論