DEV Community

Cover image for Session 與 Cookie
Angus
Angus

Posted on

Session 與 Cookie

【筆記】Session 與 Cookie

Photo by [Chaman Raj ](https://unsplash.com/@chamanraj)form [unsplash](https://unsplash.com/)

為什麼我們會需要 Session 和Cookie ?

在這邊要先提到 HTTP 無狀態(stateless)的特性,這個特性會讓每個 HTTP 請求都是獨立的,也因為這個原因使得瀏覽器無法紀錄網路上的行為,所以當今天使用者重開頁面,想要登入同一個網站時,就必須要不斷重複的輸入帳號以及密碼,因此就需要透過 Cookie 和 Session 來記錄狀態。

保存使用者狀態方法

*Cookie *:描述『client 與 server 目前溝通狀態』 的資料

client 與 server 間的溝通需透過 HTTP,但就如同我們上面提到的 HTTP是無狀態的,各個 request 都是獨立的個體,所以 Server 端無法記住 Client 目前的狀態。

Cookie是瀏覽器提供的一個儲存空間,提供了保存狀態資訊的功能,為了讓 server 端可以在 client 瀏覽器上記住、儲存 client 的狀態而生。

Cookie 由瀏覽器處理,具有兩個特性:

  • 只在特定網域上起作用,簡單來就是在 A 網域存入的 cookie 是不會出現在 B 網域的。

  • 有生命期限:到了生命期限後 cookie 將會失效,可自定義。

    Cookie 的資料屬性

  • domain 和 path: 設定關於 Cookie 的網域以及路徑。

  • expires / max-age: 設定 Cookie 資料過期的時間, expires 必須是一個日期,max-age 則是秒數。

  • size: cookie 資料的大小,單位是 bytes。

  • HttpOnly: 設定 cookies 的資料只能透過 server 讀取,也就是說 js 程式碼無法讀取,設定 HttpOnly 可以避免 XSS 攻擊,例如駭客可以透過嵌入

    Cookie 的缺點

  1. Cookie 上所有的數據在client 端是可以被修改的,使數據容易被偽造

  2. 字段太多會影響傳輸效率

  3. Cookies size 限制: 一個 Cookies 最大可以是 4096 bytes,而一個 domain 最多只能有 20 cookies。

所以在實際中,Cookies大多用來存放結構簡單、容量小且無意義的資訊,而像是帳號密碼這種比較敏感的資訊就不太適合放在Cookie 上。

Session:更安全的狀態管理機制

為了補足 Cookie 的缺點,我們會在 Server 端使用 Session 的機制去儲存這些狀態資訊,並產生一組 Session key 放入 Cookie 中,因為這些狀態資訊都是存在於 Server 端,因此使用者無法讀取, 使用者只能看到 session key 但不知道結構,同時也能避免 Cookie 存入過多資料,解決了Cookie ****的缺點。

打個比方,在現實生活中Cookie像是餐券,Session則是會員卡,Session可以靠著Session ID 記錄你點餐的細節、甚至是消費紀錄和喜好,可以解決而 Cookie 遺失的問題。

總結:

session:將數據保留在 Server 端並且產生出 Session ID,而 Session ID 就是憑證,是Server端所發的識別證

cookie:是瀏覽器存放資料的地方,可以存放seesion之類的資料

參考連結:
Authentication 那些小事上集:Cookie 與 Session 介紹
Day14-Session與Cookie差別
[Node.js] cookie-session驗證原理以及express-session套件使用

Top comments (0)