Как обновить массив с тем же ключом в хранилище сеансов

Question

Я пытаюсь сохранить историю посещенных страниц в сеансовом хранилище. Сессионное хранилище работает нормально, как я хочу.

Проблема: , когда я посетил 1,2,3, 4 страницы затем снова посетить 2-ю страницу и 3-й странице, то он не обновляет массив с снова 2 и 3-й странице.

не добавляя данные в массиве 2-й и 3-й страницы, они уже существуют, но я снова посетил эти страницы, затем его нужно добавить в массив. .

Я хочу хранить каждую посещенную историю в массиве.

if (window.sessionStorage) { 
    var currentTite = document.title; 
    var currentURL = window.location.href; 
    sessionStorage.setItem(currentTite, currentURL); 
    //var storedData = sessionStorage.getItem(currentTite); 

    for (i = 0; i <= sessionStorage.length - 1; i++) { 
     key = sessionStorage.key(i); 
     console.log(key); 
     val = sessionStorage.getItem(key); 
     console.log(val); 
    } 
} 

Вот пример кода с образцами html-страниц. Имя: simplestyle_banner.tar.gz

http://expirebox.com/download/34893b0eea4538b039c913993877393c.html

Answer 1

sessionStorage объект не является массивом. Это экземпляр встроенного конструктора Storage, который сохраняет данные при навигации по страницам. И вы можете иметь только одно значение для каждого ключа. Лучше всего использовать пространство имен для истории в сеансе под ключом history и хранить массив JSON под этим ключом.

Вот пример:

window.addEventListener('load', function recordInHistory() { 
 
    var current = sessionStorage.getItem('history'); 
 
    if (!current) { // check if an item is already registered 
 
    current = []; // if not, we initiate an empty array 
 
    } else { 
 
    current = JSON.parse(current); // else parse whatever is in 
 
    } 
 
    current.push({ 
 
    title: document.title, 
 
    url: window.location.href 
 
    }); // add the item 
 
    sessionStorage.setItem('history', JSON.stringify(current)); // replace 
 
});

Чтобы получить историю, из курса JSON.parse(sessionStorage.getItem('history')) будет работать.

Answer 2

Это зависит от того, как вы хотите обработать данные впоследствии. Во всяком случае, поскольку sessionStorage - хранилище с ключом, вы не можете хранить разные значения с теми же ключами, и вы не можете иметь двойные пары ключ-значение в хранилище.

В качестве опции вы можете сохранить массив истории пользователя, представленный объектами ({ title: document.title, url: window.location.href }). Код будет выглядеть примерно так:

var UserHistory = { 
    key: 'userHistory', 
    push: function() { 
     var cur = JSON.parse(sessionStorage.getItem(UserHistory.key)) || []; 
     cur.push({ title: document.title, url: window.location.href }); 
     sessionStorage.setItem(UserHistory.key, JSON.stringify(cur)); 
    }, 
    get: function() { 
     return JSON.parse(sessionStorage.getItem(UserHistory.key)); 
    } 
} 
UserHistory.get(); // null 
UserHistory.push(); 
UserHistory.get(); // [ Object ] 

Answer 3

первый параметр setItem является ключом, вы можете добавить случайное число или Date.now() или значение счетчика ++, чтобы сделать его уникальным.

if (window.sessionStorage) { 
    var currentTite = document.title; 
    var currentURL = window.location.href; 
    sessionStorage.setItem(currentTite + ':' + Date.now().toString(), currentURL); 

    for (i = 0; i <= sessionStorage.length - 1; i++) { 
     key = sessionStorage.key(i); 
     console.log(key); 
     val = sessionStorage.getItem(key); 
     console.log(val); 
    } 
}