Web Storage @ HTML5

90年代起始流行的，把部分用戶資料給塞進cookie的作法，盛極一時，但也因著檔案大小限制(4KB)產生了一些反思，在新的HTML5的功能上，提供了以一種local storage的概念，讓我們可在系統開發時，盡可能的多運用點用戶端的資源，同時也免除了cookies 的先天缺陷 !!

HTML5 的 web storage，提供了一系列的api，使得browser 可以存放大約5~10mb(對每一個網域) 的資料，從而降低了對server端的通訊的必要...

其實，說是web storage，倒不如說是local storage，因為實際的存儲空間使用，是放在每個用戶的機器上的，而這樣的使用方法api如下所示

localStorage.setItem(key,value);
localStorage.getItem(key); //簡單到不行了..zzz

那麼我們可能有一個困惑就是，假設都存在客戶端了，那麼那些人可以看到這些資料?
local storage依據資料的來源(domain)做管理，譬如說每個aaa.com上面的網頁，都能看到同一個網站內的其他網頁儲存的項目，但一旦跨了網域就不行了( sandbox ?)

不過特別要提一件事情，就是local storage一般是針對server uri 做服務的，如果你想單獨的對 file uri ( ex: file:///) 做網頁的local storage，很可能有時候無法正常運作，記得放上server 再做測試，或者換個browser 試試看。

在紀錄這些資料的時候，我們對於key的命名，需要鍵入的是一個唯一的名稱，避免因為同樣的key 造成了資料重複的問題，此外還有一個特別要注意的事情，因為local storage是依存於browser的，所以假設你在safari上頭 寫入了local storage，那麼當你用chrome造訪同一個網頁時是會拿不到東西的，如果有為了考量用戶的跨瀏覽器使用的議題的話，仍然需要準備一套同步資料的方式來進行，不然就悲劇了!!

localStorage的儲存機制，並不是依照你放入的順序來排序的，每一套瀏覽器的解讀效果很可能都不同，所以若要按照你想要的內容作排序的話，要額外一段js + css才能達成需求!對於同一個類型資料眾多的狀況下，可以考慮使用陣列做處理，同時也可將js 物件存入，只要你先把js物件先做json轉型字串就可以了

刪除localStorage資料的用法很簡單，就直接呼叫 localStorage.clear()，便會將網頁所處的網域內的資料全數刪除，單一的刪除特定資料則是 localStorage.removeItem(key);

儲存機制，除了localStorage的這種永久性儲存，也仍然有基於會話期間的存放方式，sessionStorage，一旦session invalidate ，所有的儲存項目會被自動清空。