I am trying to keep some data in sessionStorage, but if I refresh the page or leave from a link then come back, the sessionStorage no longer exists.

I am new to sessionStorage, so sorry if this is an obvious fix.

Essentially I store an array into the sessionStorage.

  $scope.addPlant = function(plant) {
    for (i = 0; i < $scope.userPlantList.length; i++) {
      if ($scope.userPlantList[i] === plant) {
        alert("You have already added this plant");
        return;
      }
    }
    $scope.userPlantList.push($scope.currentPlant);
    sessionStorage.setItem("Plants",JSON.stringify($scope.userPlantList));
  };

And then when I want to see what is all stored

  $scope.retreiveList = function() {
    var retrieved = sessionStorage.getItem("Plants");
    $scope.userPlantList = JSON.parse(retrieved);
  }

And this works fine when I do not refresh the page/app at all.

Question: How can I get my sessionStorage to last during a refresh/immediate re-visit?

I am trying to keep some data in sessionStorage, but if I refresh the page or leave from a link then come back, the sessionStorage no longer exists.

I am new to sessionStorage, so sorry if this is an obvious fix.

Essentially I store an array into the sessionStorage.

  $scope.addPlant = function(plant) {
    for (i = 0; i < $scope.userPlantList.length; i++) {
      if ($scope.userPlantList[i] === plant) {
        alert("You have already added this plant");
        return;
      }
    }
    $scope.userPlantList.push($scope.currentPlant);
    sessionStorage.setItem("Plants",JSON.stringify($scope.userPlantList));
  };

And then when I want to see what is all stored

  $scope.retreiveList = function() {
    var retrieved = sessionStorage.getItem("Plants");
    $scope.userPlantList = JSON.parse(retrieved);
  }

And this works fine when I do not refresh the page/app at all.

Question: How can I get my sessionStorage to last during a refresh/immediate re-visit?

• javascript
• angularjs
• local-storage
• session-storage

• @JonathanLonowski Refreshing a page don't close the session. So the issue is somewhere else – Rémi Becheras Commented Mar 4, 2015 at 17:54
• 3 Are you sure that on refresh, your script don't erase the data ? – Rémi Becheras Commented Mar 4, 2015 at 17:55
• Is any of your code asynchronous? – Kris Krause Commented Mar 4, 2015 at 17:56
• 3 @Austin Go to the developer tools and make sure your data are gone from sessionStorage. If you using chrome: F12 -> Resources tab -> Session Storage. – alsafoo Commented Mar 4, 2015 at 18:04
• 2 @alsafoo whoooaa they do exist! So...what am I doing wrong in my access statement? Are they lost out of my scope or something? – Austin Commented Mar 4, 2015 at 18:07

3 Answers 3

Check if the data are really gone by looking at the developer tools

If you using chrome: F12 -> Resources tab -> Session Storage.

sessionStorage lives with the browser tab. whenever you close a tab the sessionstorage data will be wiped out.

if you want something that will be shared across tabs, look for localStorage.

I would recommend using the $window provider from angular

// set
$window.sessionStorage.setItem('Plants', angular.toJson($scope.userPlantList));
// get
$scope.userPlantList = angular.fromJson($window.sessionStorage.getItem('Plants')) || [];

If you have devtools open, Chromium (at least version 124) seems to have a bug where if you do something like:

btn.onclick = () => {
  sessionStorage.test = 'x';
  location.reload();
}

It will not save your test-key. Just spent way too long figuring that out. Much frustrate.

The bad solution is to close devtools and hope you and your users don't have it open when clicking that button.