Reputation: 143
first of all thank you for taking the time to read this and to help me.
I'm creating a SPA via Angular and I need something like a session to "save" some data (users, ids, settings, etc.), but just for the logged in user. My question was what should I use, cookies or sessions ? Or is there anything else that may give me the "best practice".
I researched about this topic for 2 days now. My results are that the most common way these days is server-sided data with the session id encrypted in a cookie.
Is there like a template or something on what to save server-sided and where to save it ? Do I create a new table in a database?
I hope you guys understand my question. Thank you for taking the time.
Greetings Nico aka. Myridor
Upvotes: 2
Views: 1806
Reputation: 3292
If I'm getting you right, your requirements are:
In this case client side storage technologies and in particular cookies as well as LocalStorage are the right choices. You have to invalidate/delete the data when logging in (alternatively when logging out or opening the page without a valid login cookie) to prevent using old settings.
Upvotes: 0
Reputation: 584
As you have mentioned that you want to store users, IDs and user settings, I think you should go with Local-storage and not session storage or Cookies. Because session-Storage will clear the memory once you close the tab/browser. Whereas , local-storage will maintain the encrypted data in local machine (not shared with server as in case of Cookies) as long as someone does browser clean-up. I have explained in detail as follows.
Cookies: The 4K limit is for the entire cookie, including name, value, expiry date etc. To support most browsers, keep the name under 4000 bytes, and the overall cookie size under 4093 bytes. The data is sent back to the server for every HTTP request (HTML, images, JavaScript, CSS, etc) - increasing the amount of traffic between client and server.We can set the expiration time for each cookie
sessionStorage: It is similar to localStorage. Changes are only available per window (or tab in browsers like Chrome and Firefox). Changes made are saved and available for the current page, as well as future visits to the site on the same window. Once the window is closed, the storage is deleted The data is available only inside the window/tab in which it was set. The data is not persistent i.e. it will be lost once the window/tab is closed. Like localStorage, it works on same-origin policy. So, data stored will only be available on the same origin.
LocalStorage: Providing much greater storage capacity. Available size is 10MB which considerably more space to work with than a typical cookie. The data is not sent back to the server for every HTTP request (HTML, images, JavaScript, CSS, etc) - reducing the amount of traffic between client and server. The data stored in localStorage persists until explicitly deleted. Changes made are saved and available for all current and future visits to the site. It works on same-origin policy. So, data stored will only be available on the same origin.
Upvotes: 2
Reputation: 7801
localStorage and sessionStorage, part of the web storage API, are two great tools to save key/value pairs locally.
Both localStorage and sessionStorage offer advantages compared to using cookies:
The data is saved locally only and can’t be read by the server, which eliminates the security issue that cookies present. It allows for much more data to be saved (10Mb for most browsers). It’s simpler to use and the syntax is very straightforward. It’s also supported in all modern browsers, so you can use it today without an issue. Obviously, since the data can’t be read on the server, cookies still have a use, especially when it comes to authentication.
further reading Introduction to localStorage and sessionStorage
Upvotes: 0