HTML5 localStorage 对象是否按页面/域隔离?我想知道因为我将如何命名 localStorage 键。我需要一个单独的前缀吗?或者我可以随意命名它们吗?
在 HTML5 中,localStorage 对象是否按页面/域隔离?
它是按域和端口(与同源策略相同的隔离规则),要使其按页显示,您必须使用基于location
或其他方法的密钥。
您不需要前缀,但如果需要,请使用前缀。此外,是的,您可以随意命名它们。
存储是每个 origin,其中“origin”与同源策略相同(模式 [ http
vs.https
等]、端口和主机的组合)。从规范:
每个顶级浏览上下文都有一组唯一的会话存储区域,每个源一个。
因此,存储 forhttp://a.example.com
和存储 forhttp://b.example.com
是分开的(并且它们都与 分开http://example.com
),因为它们都是不同的主机。同样,http://example.com:80
和http://example.com:8080
和https://example.com
都是不同的起源。
Web 存储中没有任何机制允许一个源访问另一个源的存储。
需要注意的是它的起源,而不是URL,所以http://example.com/page1
并http://example.com/page2
都具有访问存储的http://example.com
。
正如其他人指出的那样,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
如您所见,原始值受到尊重,您可以创建多个实例来控制您的存储。
是的,每个域/子域都有不同的localStorage,您可以随意调用密钥(不需要前缀)。
要获取密钥,您可以使用 key(index) 方法,例如
localStorage.key(0);
之前有一个名为globalStorage的对象,您可以在其中拥有多个 localStorage,但它已从规范中弃用
正如尼克建议的那样,它在该域的任何地方都可用,作为替代方案, sessionStorage 的工作方式略有不同,因为它与浏览器窗口本身不同。也就是说,同一域上的其他选项卡或窗口无权访问存储对象的同一副本。