😏💪不管在看這篇文章的你有沒有從事網頁開發,
我會從頭到尾完整介紹日常中使用網際網路瀏覽網頁時所會接觸的三個東西。
1.Cookie
What?
:是餅乾嗎?
:是喔!但不能吃ㄎㄎ~
瀏覽網頁後會在你的電腦系統留下紀錄檔案,用途是(紀錄用戶端訊息),這就是 Cookie。
當你再去瀏覽這些網站時,系統便會去讀取這些 Cookie 檔並且會重新儲存一遍。
當你再去瀏覽這些網站時,系統便會去讀取這些 Cookie 檔並且會重新儲存一遍。
Where?
Cookie (儲存在瀏覽器),等到下次要送資訊給伺服器就 "全部" 送給伺服器,大多用在記錄登入資料,例如讓瀏覽器自動記錄帳號密碼,進而自動登錄 Gmail、Facebook 和各大拍賣網站。這就是 cookie 的主要功能,因為功能單純,cookie 的容量相當小(Cookie不能放太大,大小通常 5K 以下),如果你放100MB就完蛋了會爆炸知道嗎!而且 cookie 運作在 HTTP 網址上。畢竟登錄頁面的 form 也是利用 HTTP 來回傳客戶輸入的帳號與密碼。
2.Session
What?
了解 Session 時必須有個觀念,就算沒有 Cookie 的存在,Session 機制也可以正常運作。
簡單來說,Session 的機制就像是你去遊樂園買票得到入場券,然後你玩雲霄飛車要進場、摩天輪也要進場任何遊樂設施都要進場,但是那麼多工作人員根本不知道你是誰。所以,如果你要玩遊樂設施就得靠這張入場券,工作人員只會根據入場券,認定你是有買票的遊客。
實作上的困難度考量還有現今的瀏覽器預設都支援 Cookie,所以現有的網站框架中都預設採用 Cookie 來發入場券和兌換資料(Cookie 是拿來製作 session!)。Cookie 的交換會在建立連線時,在背景自動完成,因此開發者不必考慮Client/Server的入場券交換問題。因為瀏覽器會在建立連線後,第一時間就自動在背景把 Cookie 上傳到 Server,Server 也在回傳資料時,第一時間自動把 Cookie 回傳給 Client。
理解 Session 的原理後,回到 HTTP 上就是一樣的。只是,在網頁技術中,
有兩種方法讓 Client 取得入場券,一個是用 Cookie,另一個是直接輸出並嵌入頁面之中的方法(就是要你把號碼背起來)。
有兩種方法讓 Client 取得入場券,一個是用 Cookie,另一個是直接輸出並嵌入頁面之中的方法(就是要你把號碼背起來)。
因此 Cookie-based Session 就被提出為一個解決方案,把資料暫存放在 Cookie 中,
讓 Client 自己負責保存。簡單來說,就是把你要玩的遊樂設施,通通寫在入場券上。
Server 就可以直接看你的入場券上寫了什麼,而不必花大量時間去後面建立大規模的 Server 來處理 Session 。
不過,因為 Cookie 有 4K 資料大小的限制,很多網站服務會選擇 cookie-based 和後端儲存並行的方案。或許有人會問到 Cookie 是否有可能被篡改?這類安全問題,通常會使用加密手段來解決。一般來說,Cookie-based session 的 cookie 會被加密,只有 Server 才知道如何解開,Client 並沒有能力可以存取,只是得到一個看不懂的包裹,所以不會有安全性的問題(當然還是有機會被破)。由於仍然存在風險,這也是其中一個原因,為什麼有些網站仍然會採用 cookie-based 和後端儲存 Session 並行的解決方案,或是會避免把敏感資料放在 Cookie-based Session 上。
Session傳值?
時常會聽到『使用 Session 傳值』這類說法,其實就是利用 Session 機制儲存資料,讓不同頁面之間可以互相傳遞資料。其原理通常是使用 Query String 或 POST body 等方法,把資料往 Server 傳之後,在 Server 端將 Client 上傳的資料存在 Session 之中。之後的連線或開啟其它頁面時,因為你拿的號碼牌是同一個,所以在不同的頁面之下,仍然可以讀到前一次所儲存在 Session 的狀態。
Where?
一個 Session 代表使用者開啟瀏覽器連線網站,一直到關閉瀏覽器為止的工作期間。
這個期間不論使用者瀏覽該網站任何網頁甚至離開網站後又回來,對於這個網站來說都是同一個 Session,不過只要重新開啟瀏覽器便是一個新的 Session,所以即使是同一個使用者,開啟兩個瀏覽器視窗連線同一個網站,這會被視為兩個獨立的 Session。
這個期間不論使用者瀏覽該網站任何網頁甚至離開網站後又回來,對於這個網站來說都是同一個 Session,不過只要重新開啟瀏覽器便是一個新的 Session,所以即使是同一個使用者,開啟兩個瀏覽器視窗連線同一個網站,這會被視為兩個獨立的 Session。
3.Local Storage
What?
Local storage 是現在最常用的瀏覽器紀錄模式,可以利用物件的方式來自定義要傳入的資料格式,當提領出資料時再分析。
Where?
購物網站用來記錄"你看過的商品"的資料就是以 local storage 的格式。而 "巴哈姆特動畫瘋" 這個頁面也是使用 local storage 來記錄你上一部看過的卡通並標示出來,方便你了解目前看到第幾集。有興趣可以到該頁面使用 Google Developer Tool 檢查看看。
整理出這三個的明細表格,包含容量、支援性、生命週期等等。
現在很少用到 Cookie,都用 localstorage 居多而且 localstorage 有 5MB 而且它不會自己傳送給 server (除非你白目寫程式讓它拋送給server)


留言
張貼留言