web-dev-qa-db-ja.com

HTML5では、localStorageオブジェクトはページ/ドメインごとに分離されていますか？

HTML5 localStorageオブジェクトはページ/ドメインごとに分離されていますか？ localStorageキーにどのように名前を付けるのか疑問に思っています。別のプレフィックスが必要ですか？または、好きな名前を付けることができますか？

javascripthtml5local-storage
147
Nathan Moos

ドメインごと（ 同じOriginポリシー と同じ分離規則）、ページごとに作成するには、locationに基づいたキーまたは他のアプローチを使用する必要があります。

プレフィックスは必要ありません必要はありません。ただし、必要な場合はプレフィックスを使用します。また、はい、好きな名前を付けることができます。

172
Nick Craver

ストアはオリジンごとに、ここでオリジンは 同じオリジンポリシー （スキーマ[http vs. httpsなど]、ポート、およびホスト）。 仕様 から：

各トップレベルのブラウジングコンテキストには、各Originに1つずつ、一意のセッションストレージエリアのセットがあります。

したがって、http://a.example.comのストレージとhttp://b.example.comのストレージは別個のものです（また、両方ともhttp://stackoverflow.comとは別個のものです）。これらはすべて異なるホストです。同様に、http://example.com:80とhttp://example.com:8080とhttps://example.comはすべて異なる起源です。

1つのOriginが別のOriginのストレージにアクセスできるようにするWebストレージに組み込まれたメカニズムはありません。

URLではなくOriginなので、http://example.com/page1とhttp://example.com/page2は両方ともhttp://example.comのストレージにアクセスできます。

14
T.J. Crowder

ええ、各ドメイン/サブドメインには異なるlocalStorageがあり、好きなキーを呼び出すことができます（プレフィックスは不要です）。

キーを取得するには、次のようなメソッドkey（index）を使用できます

localStorage.key(0);

globalStorageというオブジェクトが複数のlocalStorageを持つことができる場所の前にありましたが、仕様から廃止されました

7
sebarmeli

他の人が指摘したように、localStorageはプロトコル、ホスト、ポートごとに一意です。プレフィックス付きキーでストレージを制御する便利な方法が必要な場合は、 localDataStorage をお勧めします。

キーにプレフィックスを付けることにより、同じドメイン内でセグメント化された共有ストレージを強制するのに役立つだけでなく、javascriptデータ型（配列、ブール、日付、浮動小数点、整数、文字列、オブジェクト）を透過的に保存し、軽量のデータ難読化を提供し、文字列を自動的に圧縮します。キー（名前）によるクエリと（キー）値によるクエリを容易にします。

[免責事項]私はユーティリティの作成者です[/免責事項]

例：

// instantiate our first storage object
// internally, all keys will use the specified prefix, i.e. passphrase.life
var localData = localDataStorage( 'passphrase.life' );

localData.set( 'key1', 'Belgian' )
localData.set( 'key2', 1200.0047 )
localData.set( 'key3', true )
localData.set( 'key4', { 'RSK' : [1,'3',5,'7',9] } )
localData.set( 'key5', null )

localData.get( 'key1' )   -->   'Belgian'
localData.get( 'key2' )   -->   1200.0047
localData.get( 'key3' )   -->   true
localData.get( 'key4' )   -->   Object {RSK: Array(5)}
localData.get( 'key5' )   -->   null


// instantiate our second storage object
// internally, all keys will use the specified prefix, i.e. prismcipher.com
var localData2 = localDataStorage( 'prismcipher.com' );

localData2.set( 'key1', 123456789 )  // integer

localData2.get( 'key1' )   -->   123456789

ご覧のとおり、プリミティブな値が尊重され、ストレージを制御するために複数のインスタンスを作成できます。

5
Mac

LocalStorageを使用する可能性があるユーザースクリプトとの潜在的な衝突を避けるために、常にプレフィックスを使用します。

5
Benjol

Nickが示唆したように、そのドメインのどこでも利用できます。代替として、sessionStorageはブラウザウィンドウ自体とは異なるという点で少し異なる動作をします。つまり、同じドメイン上の他のタブまたはウィンドウは、ストレージオブジェクトの同じコピーにアクセスできません。

0
Matt