Storing Data Client-Side with LocalStorage and SessionStorage
Today we're going to learn about two dead simple Web Storage
sessionStorage. Using these, you can store data on the client-side and use it for various purposes. To some extent it can help provide offline access of your app to the users. It can also help save additional server requests by fetching data from the client-side.
This codecast is going to show
localStorage examples but note that both local and session storage have exactly same API. So whatever function calls you see with localStorage can be applied to sessionStorage too!
You might be wondering that, what is the difference between the two ?
Ok, so, The data stored in localStorage is going to be accessible across all open browser tabs and windows on the same origin.
While the data stored in sessionStorage only persist through that particular session. A new session is initiated when you open a webpage in a new tab or window. It lasts as long as the tab is open and survives over page reloads or "restore". A single session is tied to a tab or browser window. It doesn't shares with other tabs or windows either on same or different origin.
All the session and local storage data are tied to the same origin.
What is same origin ?
2 URLs with the same protocol (http or https), same host (cssdeck.com) and the same port (80 or 8080 or 1234) are said to be of the same origin.
Let's get started by watching the codecast now!
Warning: Invalid argument supplied for foreach() in /var/www/cssdeck/app/modules/labs/views/_details.php on line 68