1. Home
  2. Archive
  3. StorageEventで勘違いしていたこと

StorageEventで勘違いしていたこと

StorageEventってlocalStorageとかsessionStorageとかでStorageの値を書き変えたときに発生するイベントってのは知ってたんだけど、前に試してみて動かなかったんで実装されてないのかなーと思って放置してた。

でもなんか入門HTML5を読んだら、localStorage実装されてたらStorageEventも実装されてるよって書いてあったから試してみたけどやっぱ動かなかったんでちゃんと調べたら、そもそも勘違いしてたことに気づいた。

普通に

window.addEventListener('storage', function(evt) {
    console.log(evt);
}, false);

ってスクリプトを書いたHTMLを開いて、コンソールとかで localStorage.setItem(’hoge’, Math.random()) とか実行して発火しなかったんで、なんだよやっぱ動かねーじゃねーかと思ったんだけど、仕様書をよく読んだらこんな表記があった。

When the setItem(), removeItem(), and clear() methods are called on a Storage object x that is associated with a local storage area, if the methods did something, then in every Document object whose Window object’s localStorage attribute’s Storage object is associated with the same storage area, other than x, a storage event must be fired, as described below.

つまり、Storageを更新した場合、Storageを更新したドキュメント以外の、同じStorage領域を持ってるドキュメントでStorageEventが発火するってことでOK?

OKだった。さっきテストしてたやつを二つ開いて、同じようにコンソールでStorage更新したら実行してない方のウィンドウで発火してた。こういう使い方だったのね。

コメントフォーム

スパムがひどいので一時的にコメントフォーム閉じます。ゴメンナサイ。