快捷導(dǎo)航

Django中Cookie設(shè)置及跨域問題處理詳解

更新時間：2021年09月18日 11:34:14 作者：ProgramNotes

本文主要介紹了Django中Cookie設(shè)置及跨域問題處理，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下

什么是Cookie（翻譯：曲奇餅干）

Cookie是存儲在瀏覽器中的一段純文本信息（簡單的說就是瀏覽器緩存），用來記錄用戶的使用情況并將其存儲在本地設(shè)備中，當(dāng)用戶訪問服務(wù)器時會將Cookie附帶上，服務(wù)端通過讀取Cookie的記錄，來維持用戶與服務(wù)器的會話狀態(tài)。

Cookie怎么來的

Cookie是由服務(wù)器生成的，通常以鍵值對的格式呈現(xiàn)（鍵值由服務(wù)器端開發(fā)者自行定義），當(dāng)用戶通過了瀏覽器訪問服務(wù)器時，服務(wù)器會在返回數(shù)據(jù)的時候把Cookie傳給瀏覽器（建議不要存儲敏感信息，因?yàn)闉g覽器可能被多人使用）。

為什么要用Cookie

Cookie是由HTTP服務(wù)器設(shè)置的，而HTTP協(xié)議是一種無狀態(tài)協(xié)議，瀏覽器與服務(wù)器使用Socket套接字進(jìn)行通信，當(dāng)服務(wù)器將請求結(jié)果返回給瀏覽器之后就會關(guān)閉當(dāng)前的Socket連接并釋放資源，所以每次請求數(shù)據(jù)都需要建立新的連接。 Cookie的出現(xiàn)彌補(bǔ)了這個缺點(diǎn)，當(dāng)瀏覽器向服務(wù)器發(fā)送請求時，會將瀏覽器中存儲的跟網(wǎng)站相關(guān)的所有Cookie信息提交給網(wǎng)站服務(wù)器，服務(wù)器通過Cookie中的信息來驗(yàn)證用戶身份和判斷HTTP傳輸狀態(tài)，并將符合條件的數(shù)據(jù)返回給瀏覽器。

Cookie的特點(diǎn)

Cookie是基于作用域設(shè)計的，也就是說同一域名下只能訪問到當(dāng)前域名下的Cookie信息，無法訪問到其他域名的Cookie信息的。

怎么設(shè)置Cookie

Django可以通過HttpResponse來響應(yīng)對象的set_cookie，設(shè)置好對應(yīng)的視圖和路由，只要通過瀏覽器訪問該路由，瀏覽器就會自動獲取到set_cookie值并存入到本地（當(dāng)瀏覽器正在運(yùn)行時通常都存在內(nèi)存中，當(dāng)瀏覽器關(guān)閉時通常會存入硬盤中）。

Cookie常用參數(shù)

在設(shè)置Cookie時可以多參數(shù)定義，這個可以根據(jù)自己的需求來定義，最少要有key和value，其他可省略不填，方法是：response.set_cookie('鍵', '值')。

key：鍵
value：值
max_age：多久后過期，時間為秒，默認(rèn)為None，臨時cookie設(shè)置即關(guān)閉瀏覽器就消失
expires：過期時間，具體時間
path：生效路徑，默認(rèn)‘/'
domain：生效的域名，你綁定的域名
secure：HTTPS傳輸時應(yīng)設(shè)置為true，默認(rèn)為false
httponly：值應(yīng)用于http傳輸，這時JavaScript無法獲取

怎么獲取Cookie

Django可以通過HttpResponse請求對象的COOKIES屬性來讀取Cookie，方法是：request.COOKIES.get('鍵')，這樣我們在瀏覽器訪問路由時就能直接獲取到之前設(shè)置好的Cookie了。

Cookie跨域問題處理

前面我們只是簡單的進(jìn)行了路由請求，那么結(jié)合到系統(tǒng)中來又會是怎樣的呢，我把Cookie帶入到項(xiàng)目中來（前后端分離模式），我們會發(fā)現(xiàn)，同樣的代碼在前面始終無法獲取到Cookie值，這是怎么回事呢？前面有提到Cookie是基于安全域設(shè)計的，所以是不支持跨域處理的，那么我們怎么來實(shí)現(xiàn)跨域訪問呢。這里我們要采用的是“跨域資源共享”，一種可以讓瀏覽器獲得訪問不同源服務(wù)器指定資源的權(quán)限機(jī)制，通過它Axios在訪問服務(wù)器時能攜帶著Cookie回來。

首先需要axios能夠獲取到Cookie，出于安全考慮瀏覽器默認(rèn)是不支持獲取跨域Cookie的，所以這里我們需要對axios設(shè)置進(jìn)行下修改，將withCredentials屬性設(shè)置為true，即允許瀏覽器設(shè)置或獲取Cookie。設(shè)置方法直接在main.js中進(jìn)行全局設(shè)置，axios.defaults.withCredentials = true 。

當(dāng)服務(wù)器接收到請求后，會根據(jù)自己的跨域規(guī)則，決定是否同意這次請求，而這個規(guī)則在請求設(shè)置Cookie時就要給定，這里主要要設(shè)置Access-Control-Allow-Origin和Access-Control-Allow-Credentials屬性，Access-Control-Allow-Origin默認(rèn)為‘*'，這里需要改成前端ip，Access-Control-Allow-Credentials改為true即可。