Как привязать событие к sessionStorage?

Question

Я могу успешно связать событие для изменения в localStorage (используя jquery):

$(window).bind('storage', function(e)
{
    alert('change');
});

localStorage.setItem('someItem', 'someValue');

Если я использую sessionStorage, событие НЕ сработает:

 $(window).bind('storage', function(e)
{
    alert('change');
});

sessionStorage.setItem('someItem', 'someValue');

Почему это?

Answer 1

Я думаю, что так и должно быть. Из спецификации (выделение добавлено):

Когда setItem(), removeItem(), а также clear() методы вызываются на Storage объект x, который связан с областью хранения сеанса, если методы что-то сделали, то в каждом объекте Document, у которого объект Storage атрибута sessionStorage объекта Window связан с той же областью хранения, кроме x, событие хранилища должно быть запущено

Я думаю, что это означает, что событие будет запущено в любом другом документе, совместно использующем объект хранения сеанса, но не в документе, вызвавшем событие.

Обновить

Вот еще один очень похожий вопрос, который, кажется, согласуется с тем, что я упоминал выше (ответ цитирует тот же абзац из спецификации).

Answer 2

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

РЕДАКТИРОВАТЬ:

Я сделал следующий пример:

http://codepen.io/surdu/pen/QGZGLO?editors=1010

Страница примера имеет две кнопки, которые вызывают локальное изменение и изменение хранилища сеанса.

Он также встраивает iframe в другой код, который прослушивает изменения в хранилище:

http://codepen.io/surdu/pen/GNYNrW?editors=1010 (вы должны держать это открытым в другой вкладке.)

Вы заметите, что когда вы нажимаете кнопку "Write local", и в iframe, и в открытой вкладке происходит захват события, но когда вы нажимаете "Write Session", только встроенный iframe захватывает событие.

Answer 3

Этот вопрос, кажется, получает довольно много просмотров, поэтому я просто опубликую его как дополнительную информацию.

Если вы хотите отвечать исключительно на обновления объекта sessionStorage, вы можете просто игнорировать события, вызванные localStorage:

$(window).on('storage',function(e){
   if(e.originalEvent.storageArea===sessionStorage){
     alert('change');
   } 
   // else, event is caused by an update to localStorage, ignore it
});

Я ненавижу jQuery, поэтому выложу и нативную версию:

window.addEventListener('storage',function(e){
   if(e.storageArea===sessionStorage){
     alert('change');
   } 
   // else, event is caused by an update to localStorage, ignore it
});