Javascript 在 HTML5 中,localStorage 对象是否按页面/域隔离?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4201239/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 11:21:51  来源:igfitidea点击:

In HTML5, is the localStorage object isolated per page/domain?

javascripthtmllocal-storage

提问by Nathan Moos

Is the HTML5 localStorage object isolated per page/domain? I am wondering because of how I would name localStorage keys. Do I need a separate prefix? Or can I name them whatever I want?

HTML5 localStorage 对象是否按页面/域隔离?我想知道我将如何命名 localStorage 键。我需要一个单独的前缀吗?或者我可以随意命名它们吗?

回答by Nick Craver

It's per domain and port (the same segregation rules as the same origin policy), to make it per-page you'd have to use a key based on the location, or some other approach.

它是按域和端口(与同源策略相同的隔离规则),要使其按页面显示,您必须使用基于location或其他方法的密钥。

You don't needa prefix, use one if you need it though. Also, yes, you can name them whatever you want.

不需要前缀,但如果需要,请使用前缀。此外,是的,您可以随意命名它们。

回答by T.J. Crowder

The stores are per origin, where "origin" is the same as for the Same Origin Policy(a combination of schema [httpvs. https, etc.], port, and host). From the spec:

存储是每个 origin,其中“origin”与同源策略相同(模式 [ httpvs.https等]、端口和主机的组合)。从规范

Each top-level browsing context has a unique set of session storage areas, one for each origin.

每个顶级浏览上下文都有一组独特的会话存储区域,每个源一个。

Thus, the storage for http://a.example.comand the storage for http://b.example.comare separate (and they're both separate from http://example.com) as those are all different hosts. Similarly, http://example.com:80and http://example.com:8080and https://example.comare all different origins.

因此,存储 forhttp://a.example.com和存储 forhttp://b.example.com是分开的(并且它们都与 分开http://example.com),因为它们都是不同的主机。同样,http://example.com:80http://example.com:8080https://example.com都是不同的起源。

There is no mechanism built into web storage that allows one origin to access the storage of another.

Web 存储中没有任何机制允许一个源访问另一个源的存储。

Note that it's origin, not URL, so http://example.com/page1and http://example.com/page2both have access to the storage for http://example.com.

需要注意的是它的起源,而不是URL,所以http://example.com/page1http://example.com/page2都具有访问存储的http://example.com

回答by Mac

As others have pointed out, localStorage is unique per protocol, host & port. If you want a handy way to control your storage with prefixed keys, I suggest localDataStorage.

正如其他人指出的那样,localStorage 每个协议、主机和端口都是唯一的。如果您想要一种使用前缀键方便地控制存储的方法,我建议使用localDataStorage

Not only does it help enforce segmented shared storage within the same domain by prefixing keys, it also transparently stores javascript data types (Array, Boolean, Date, Float, Integer, String and Object), provides lightweight data obfuscation, automatically compresses strings, and facilitates query by key (name) as well as query by (key) value.

它不仅通过给键添加前缀来帮助在同一域内强制执行分段共享存储,还透明地存储 javascript 数据类型(数组、布尔值、日期、浮点数、整数、字符串和对象),提供轻量级数据混淆,自动压缩字符串,以及便于按键(名称)查询以及按(键)值查询。

[DISCLAIMER] I am the author of the utility [/DISCLAIMER]

[免责声明] 我是该实用程序的作者 [/免责声明]

Examples:

例子:

// 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

As you can see, primitive values are respected, and you can create several instances to control your storage.

如您所见,原始值受到尊重,您可以创建多个实例来控制您的存储。

回答by sebarmeli

Yeah, each domain/subdomain has a different localStorageand you can call the keys whatever you want (prefix is not required).

是的,每个域/子域都有不同的localStorage,您可以随意调用密钥(不需要前缀)。

To get a key you can use the method key(index) such as

要获取密钥,您可以使用 key(index) 方法,例如

localStorage.key(0);

There was an object called globalStoragebefore where you could have multiple localStorages, but it's been deprecated from the specs

之前有一个名为globalStorage的对象,您可以在其中拥有多个 localStorage,但它已从规范中弃用

回答by Matt

It is available anywhere on that domain as Nick suggested, as an alternative there is sessionStorage works slightly differently in that it is distinct to the browser window itself. That is to say that other tabs or windows on the same domain do not have access to that same copy of the storage object.

正如尼克建议的那样,它可以在该域的任何地方使用,作为替代方案, sessionStorage 的工作方式略有不同,因为它与浏览器窗口本身不同。也就是说,同一域上的其他选项卡或窗口无权访问存储对象的同一副本。