Using Javascript sessionStorage versus Cookies


 
Thread Tools Search this Thread
Top Forums Web Development Using Javascript sessionStorage versus Cookies
# 1  
Old 10-14-2018
Using Javascript sessionStorage versus Cookies

In browsers that support HTML5 we can use sessionStorage in Javascript instead of Cookies to set variables that need to be persistent per session.

For example, in this PHP code for the forums, we can do something like the following:

Code:
$localStorage  = '<script>'; 
$sessionStorage .= 'sessionStorage.setItem("showMember","true");'; 
$sessionStorage .= 'sessionStorage.setItem("thisScript","'.THIS_SCRIPT.'");'; 
$sessionStorage .= 'sessionStorage.setItem("styleId","'.STYLEID.'");'; 
$sessionStorage .= 'sessionStorage.setItem("userId","'.USER_ID.'");'; 
$sessionStorage .= '</script>'."\n";

And of course insert the code above in our HTML template somewhere (like the header) and then use the sessionStorage vars (from our server side PHP code) in our Javascript and jQuery scripts.

The main difference is that the data stored in sessionStorage is not sent back to the server per request (like in Cookies) and the storage limit is much bigger for sessionStorage than for Cookies.

In HTML5 sessionStorage differs primarily from localStorage in that localStorage does not go away even after the tab or browser is closed. It can of course be cleared with the localStorage.clear() method or cleared in browser by the user.

Here is a small example of how we use sessionStorage:

Code:
<script>
$(function() {
  if(sessionStorage.showMember && sessionStorage.thisScript !='showpost')
  {
    var text =  document.getElementById("neo-notice").innerHTML;
    var unread = text.match(/>0<\/strong>/g);
     if(!unread){
       $('.avatarbadge').show();
     }
      else {  $('.avatarbadge').hide();}
  }
});
</script>

In the code above, we are trapping an error because of some strange bug on one of our pages when we show notifications to users. Otherwise, we check for messages unread and if so, we display the badge.

Here is another example:

Code:
<script>
$(document).ready(function() {
if(sessionStorage.showMember && sessionStorage.thisScript != 'showpost')
 {
  if ($('#myMemberPanel').length > 0) {
  document.getElementById("myMemberPanel").style.width = "0px";
 }
}
});
</script>

In the above example, we trap the same error (on the 'showpost' pages which we have deprecated) and otherwise we set the initial width of the memberPanel to 0px;

These are fairly trivial examples, but they do help illustrate how easy it it is in HTML5 to use localStorage and sessionStorage in Javascript.

Last edited by Don Cragun; 10-14-2018 at 02:58 PM.. Reason: Move "<script>" inside CODE tags.
Login or Register to Ask a Question

Previous Thread | Next Thread

7 More Discussions You Might Find Interesting

1. UNIX for Dummies Questions & Answers

Cookies in UNIX

Ho can i access a url rom unix? And where can i get the cookies from unix directory? Vinodh (1 Reply)
Discussion started by: rvinodh3
1 Replies

2. Solaris

Solaris versus Centos

hi guys In a few days I will be working in a new Job my new chief told I will be using Solaris and since I know Centos-Red Hat-Fedora I would like to know if Solaris is that different from Centos and my other linux Flavors... by the way any good solaris manual thanks a lot (1 Reply)
Discussion started by: karlochacon
1 Replies

3. Web Development

PHP Help - Delete cookies and redirect back to referrer

I was wondering if any one would be willing to help me with this. I'd like to create a 503 error page using a PHP script that will do the following: - delete all cookies that contains 'something' in the host and 'JSESSIONID' as the cookie name. There are either 1 or 2 cookies that each... (0 Replies)
Discussion started by: Adrnalnrsh
0 Replies

4. UNIX for Advanced & Expert Users

cpio versus cp

I am copying a file system to another one. someone suggest me use find . -print |cpio -pdmv but I think cp -r should do the same thing. Am I right? In addition, by using " find . ", I got all the file names,, why do I have to use the -print option? Thanks a lot! (1 Reply)
Discussion started by: fredao
1 Replies

5. Shell Programming and Scripting

<LF> versus <CR>/<LF>

Hello, Can someone explain how to distinguish a LF character and a CR/LF character in a text file from a shell script. Thanks (1 Reply)
Discussion started by: jerardfjay
1 Replies

6. UNIX for Dummies Questions & Answers

CTRL+H versus ^? versus BACKSPACE

Hi Gurus! I recently got my shell account (HP UX v11) created by our sysadmin and am having problem deleting with the backspace key. After doing some reading, I believe I need to enter a custom "STTY..." statement in my profile. Can someone please help me with the correct "STTY" sequence... (3 Replies)
Discussion started by: alan
3 Replies

7. Cybersecurity

AF_UNIX versus AF_INET

I'm using AF_INET in sockets for inter process communication on the same machine. Is AF_UNIX better for IPC on the same machine than AF_INET in terms of performance? If so, how much better? I would like to know if there is sample code available to test this. I'm running the program on Solaris. ... (0 Replies)
Discussion started by: ivkumar
0 Replies
Login or Register to Ask a Question