WEB STORAGE
APIThe essence of the web, whether it is a website or an application, has long been that data is prepared and executed on servers and then displayed to users in web browsers. With the advent of HTML5, it became possible to run complete and functional applications on the client side. Before this, cookies were used for such purposes. One of the most important features of any application, to work properly, is the ability to store data so it can be used whenever needed. For storing small amounts of data on the client side, cookies were used for a long time. However, they are limited to short strings and are useful only in specific circumstances.
Web storage allows developers to store data needed for the functionality of a website or application, which remains on the user's local disk. The data can persist briefly during a browsing session within the same domain or longer, allowing access when the user revisits the site.
The Web Storage API/interface is an improvement over cookies as it allows data to be saved on the user's disk so the HTML code can access it. The Web Storage API is suitable for two scenarios:
1. When the data needs to be available only during the session's duration - sessionStorage
2. When the data needs to persist as long as specified by the user, similar to desktop applications, where stored data is retained permanently and is always accessible - localStorage
Both mechanisms operate using similar interfaces, have the same methods and properties, and are applied in the same way. Both depend on the origin of the data, meaning the data is available only to the website that defined it. In other words, both storage types (local and session) can be accessed only by the web application/site from the same domain that created them (same-origin policy). Both session and local storage work only within the same domain. For example, the following links do not belong to the same domain:
https://mydomain.com/ http://mydomain.com/ https://mydomain.com:8080/
Web storage is supported starting with IE8, including all methods. Each browser allocates up to 5MB of free space (storage) for the same-origin policy for an open page, while IE provides 10MB. Exceeding this limit will result in an error. 5MB roughly equals 5,100,000 characters. Both local and session storage are ideal for storing non-sensitive data, especially in the case of session storage. This data can easily be modified or deleted, and since it is stored on the local disk, it is not secure for sensitive information.
SESSION STORAGE
Session storage enables the browser to temporarily save the data required for a web application or site to the local disk for the duration of the session. The data can only be used for that specific tab or browser window while it is open and only for the designated domain.
The Session Storage API is a more advanced alternative to cookies. Both cookies and session storage retain data for a specific period, but the difference lies in their scope. Cookies apply to the entire browser (across all tabs and open pages), meaning session cookies are available as long as at least one browser window remains open. On the other hand, session storage applies only to a specific tab or window, and the data is available only until that tab or window of the respective session is closed (reload does not affect it). When the tab or window is closed, the data is removed.
Session storage is tied only to one browser tab/window, so the same site (same-origin policy) opened in another tab of the same browser cannot share the same session storage. Local storage, however, can.
Author of the text: bbosko
Add Your Comment