Session
伺服器通過 Set-Cookie給使用者一個sessionId
sessionId對應伺服器內的一小塊記憶體
每次使用者訪問伺服器的時候，伺服器就聽過SessionId去讀取對應的session
從而知道使用者的資訊
sessionId的篡改就很難了，因為使用者得到的只是一個隨機數而已
session其實就是一塊記憶體
複製程式碼- 為什麼要使用Session？
我們在登入成功之後，後端會將使用者資訊存入到資料庫，然後在迴應裡面會寫入一個欄位：
"Set-Cookie:'這裡是使用者名稱+密碼或者其他使用者資訊'"
自此之後，客戶端的每一次請求都會自動帶上這段cookie資訊
但是，會有一個問題就是，cookie有可能會被篡改，如果被篡改了的話，資訊就亂了，
比如，使用者只要改下cookie中的使用者名稱，就可以以另外一個身份登入了。
複製程式碼- Session的使用？
在使用者登入成功之後，伺服器會在記憶體中寫入一個sessionId，是一個隨機數
然後這個sessionId 對應的就是使用者的登入資訊。
然後再將這個sessionId以迴應資訊回傳給客戶端，
通過Set-Cookie: sessionId('2678613863'),寫入瀏覽器。
以後，瀏覽器再次請求的時候 就是帶上這個sessionId給伺服器，伺服器通
過檢視客戶端帶上來的cookie裡面的這個sessionId
去尋找該使用者的登入資訊，如果找到的話，就是已經是登入成功了，如果沒有找到的話
那就是沒有這個使用者需要註冊的了
複製程式碼總結Cookie與Session：
Cookie
1. 伺服器通過Set-Cookie頭給客戶端一段字串
2. 客戶端每次訪問相同域名的網頁的時候，必須帶上這段字串
3. 客戶端要在一段時間內儲存這個Cookie
注意：前端不要寫Cookie,影響效能
複製程式碼Session
1. 將SessionId通過Cookie發給客戶端
2. 客戶端訪問伺服器時，伺服器讀取SessionId
3. 伺服器中有一塊記憶體（雜湊表）儲存了所有session
4. 通過SessionId我們可以得到對應使用者的隱私資訊，如使用者名稱密碼等
複製程式碼LocalStorage
localStorage是html5提供的一個API,localStorage的實質是一個雜湊
Session是伺服器的雜湊表
localStorage是瀏覽器的雜湊表
localStorage只能存字串
localStorage的值其實是存在c盤的檔案裡面
1. LocalStorage與Http無關
2. Http每次請求不會帶上LocalStorage的值
3. 只有相同域名的頁面才能互相讀取LocalStorage（這個功能由瀏覽器完）
4. 每個域名LocalStorage最大儲存量為5MB左右，每個瀏覽器不一樣
5. LocalStorage永久有效，除非清楚
複製程式碼SessionStorage
1,2,3,4同localStorage，
不同的是，SessionStorage在使用者關閉頁面後就失效
面試相關
- Cookie與Session有什麼關係？
一般來說，Session是基於Cookie實現的，Session依賴於Cookie將SessionId發給客戶端
複製程式碼- Cookie與LocalStorage的區別？
最大的區別就是Http每次請求不會帶上LocalStorage的值，但是會帶上Cookie的值
複製程式碼- LocalStorage 與 SessionStorage的區別？
也可以不基於Cookie的Session
Session是基於Cookie實現的，那麼有沒有不基於Cookie的Session呢？
後端在使用者登入之後，伺服器就為它生成一個SessionId ,然後以迴應的內容返回給客戶端，
然後客戶端每次傳送請求的時候，把獲取到的SessionId放在請求引數中，
複製程式碼Http快取（Cache-Control）
Cache-Control: max-age=3600 意思是：3600s內不要再次請求，即快取3600s
(大部分是設定了一年)
Cache-Control是http寫入客戶端的，這個可以加快頁面下載速度
例子：
比如我們要請求一個main.js，客戶端第一次去請求的時候，大概花了1s鐘的時間，
然後伺服器接受到請求之後，通過 將Cache-Control: 30 （預設單位為s），
傳回給瀏覽器，那麼在30s內，我們再重新整理頁面時，瀏覽器就會阻隔請求，
會直接從快取中讀取這個js,過了30s之後才會去重新發起請求
我們可以看到下圖，第二次請求的時候只有0s，這將會極大地提升頁面開啟速度
如果勾選了 Disable cache 你就是不會讀取快取了，每次都會去請求資源
複製程式碼
注意：頁面的首頁最好不要設定Cache-Control: max-age=30，
為什麼呢？
首頁設定了快取，使用者沒辦法獲取到最新的程式碼，
如果想要更新快取的話，給js或者css的請求地址後加一個隨機的查詢引數，這樣每次請求的url就不一樣了，就可以就可以更新快取了
如下圖所示：
Exipres
如果設定了Cache-Control,那麼exipres就失效了 ，
以前設定快取用Expires現在用Cache-Control
複製程式碼
Cache-Control表示多久之後過期，Expires:代表什麼時候過期
但是Expires表示的是本地時間，所以如果使用者更改本地時間的話，那你設定的快取很可能就無用了，不靠譜了。
Last-Modified
上一次的修改時間 Last-Modified: Thu, 26 Jul 2018 09:10:00 GMT
MD5
摘要演演算法
檔案差異越小，md5算出來的值得差異越大
Etag
Etag與Cache-Control的區別
Cache-Control是快取了之後，在快取時間之內就不再請求，
然而Etag是請求了之後，發現MD5一樣，就返回一個'if-none-match=MD5(string)'這個響應頭，如果存在這個，就直接不下載內容（比如js或者css等）
總結一下就是用Cache-Control後直接不請求，用了Etag就不下載但是還是會下載的
Cache-Control要更優，因為它直接就不請求了