Stockage de session en js

Question

Bonjour, je suis débutant en JavaScript et j'aimerais demander s'il est possible de mettre en session les données que je reçois d'un serveur. Les données que je veux mettre en session sont celles de 'data.xhr.response'. J'ai cherché en ligne et j'ai vu que la plupart des gens utilisent la fonction SessionStorage mais je ne suis pas vraiment sûr de comment m'y prendre, toute suggestion serait appréciée.

$(function() 
{
Dropzone.autoDiscover = false;

$('#file-upload').dropzone({
    maxFiles: 1,
    acceptedFiles: ".pdf,.doc,.docx,.html", 
    dataType: "json",
    success : function(data) {
        console.log(data.xhr.response);

    }
    });
});

Answer 1

Le stockage de session est le même que le stockage local, mais la seule différence est que les données stockées dans le stockage de session seront effacées automatiquement une fois la session de la page expirée.

Maintenant, passons à votre question. Dans votre fonction success, faites comme ci-dessous pour stocker les données :

success : function(data) {
    console.log(data.xhr.response);
    sessionStorage.setItem('dataStored', data.xhr.response);
}

L'utilisation est comme ci-dessous :

// Enregistrer les données dans le stockage de session
sessionStorage.setItem('dataStored', data.xhr.response);

// Obtenir les données enregistrées depuis le stockage de session
var data = sessionStorage.getItem('dataStored');

// Supprimer les données enregistrées du stockage de session
sessionStorage.removeItem('dataStored');

// Supprimer toutes les données enregistrées du stockage de session
sessionStorage.clear();

Pour plus d'informations sur sessionStorage consultez ce lien : https://developer.mozilla.org/fr/docs/Web/API/Window/sessionStorage

Answer 2

Essayez de lire cet article sur le stockage de session sur mozilla.org, il montre à quel point c'est simple. Dans votre cas, cela devrait être aussi simple que :

$('#file-upload').dropzone({
  maxFiles: 1,
  acceptedFiles: ".pdf,.doc,.docx,.html", 
  dataType: "json",
  success : function(data) {
      sessionStorage.setItem('xhr', data.xhr.response);
  }
});

Answer 3

Dans votre cas, vous pouvez choisir entre sessionStorage ou localStorage. Les deux peuvent enregistrer la réponse de données pour vous dans le navigateur. La différence réside uniquement dans l'expiration, localStorage ne expire pas tandis que sessionStorage stocke les données pour une session (les données sont perdues lorsque l'onglet du navigateur est fermé).

Les étapes sont les suivantes :

1. Vérifiez votre navigateur pour voir s'il prend en charge le stockage web :

   if (typeof(Storage) !== "undefined") {
       // Code pour localStorage/sessionStorage.
   } else {
       // Désolé ! Aucun support de stockage Web.
   }

2. Mettre en œuvre localStorage :

   localStorage.setItem("lastname", "Smith");  // sauvegarder les données
   var user = localStorage.getItem("lastname"); // obtenir les données
   localStorage.removeItem("lastname");  // supprimer les données

3. Mettre en œuvre sessionStorage :

   sessionStorage.setItem('lastname', 'Smith'); // sauvegarder les données
   var user = sessionStorage.getItem('lastname'); // obtenir les données
   sessionStorage.removeItem('dataStored');  // supprimer les données

J'espère que cela vous aidera!