javascript HTML5 会话存储发送到服务器

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16792158/
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-10-27 06:00:47  来源:igfitidea点击:

HTML5 session storage send to server

javascripthtmlsession-storage

提问by Grégory

If I'm right, Session Storage is stored client side and is accessible only for one tab.

如果我是对的,会话存储存储在客户端,并且只能通过一个选项卡访问。

How can I send information stored in the session storage to the server ? I can use cookie for that, but if I open 2 tabs, the cookie will be rewrite by the second tab.

如何将会话存储中存储的信息发送到服务器?我可以为此使用 cookie,但如果我打开 2 个选项卡,cookie 将被第二个选项卡重写。

Thanks

谢谢

回答by

The Storage object (both localStorage and sessionStorage) is available from all tabs having the same page open.

Storage 对象(localStorage 和 sessionStorage)可从打开相同页面的所有选项卡中获得。

However (some comment state this is not correct, but this is a misinterpretation of the documentation), when you open a new tab a new storage object is created internally. This is a cloneof the first one so the content at that point is the same.

但是(一些评论指出这是不正确的,但这是对文档的误解),当您打开一个新选项卡时,会在内部创建一个新的存储对象。这是第一个的克隆,因此当时的内容是相同的。

They are treated separate from that point, but you synchronize them by listening to the storageeventin your code.

从那时起,它们被分开处理,但是您可以通过侦听代码中的storage事件来同步它们 。

From http://dev.w3.org/html5/webstorage/#the-sessionstorage-attribute: (note that the specs are addressing the implementers)

来自http://dev.w3.org/html5/webstorage/#the-sessionstorage-attribute:(注意规范是针对实施者的)

When a new top-level browsing context is created by cloning an existing browsing context, the new browsing context must start with the same session storage areas as the original, but the two sets must from that point on be considered separate, not affecting each other in any way. [...] When the setItem(), removeItem(), and clear() methods are called on a Storage object x that is associated with a session storage area [...], then for every Document object whose Window object's sessionStorage attribute's Storage object is associated with the same storage area, other than x, send a storage notification.

当通过克隆现有浏览上下文创建新的顶级浏览上下文时,新的浏览上下文必须从与原始浏览上下文相同的会话存储区域开始,但从那时起,这两个集合必须被视为独立的,互不影响以任何方式。[...] 当 setItem()、removeItem() 和 clear() 方法在与会话存储区域相关联的 Storage 对象 x 上被调用时 [...],然后对于其 Window 对象的 sessionStorage 的每个 Document 对象属性的Storage对象关联同一个存储区,x以外,发送存储通知

That is to say that when a storage is modified in the active tab, a storageevent is sent to all the other tabs (for the same origin) - but not the active tab which of course isn't needed as this is the one being modified.

也就是说,当在活动选项卡中修改存储时,storage会将事件发送到所有其他选项卡(对于同一来源) - 但不是活动选项卡,当然不需要,因为这是正在修改的选项卡.

Use the eventto read the keyand newValuefields to update the localSessionin the currently inactivetab(s) (there is also the oldValueon the event). The storageAreacontains the Storage object that is affected (useful if you use both local and session storage).

使用事件读取keynewValue字段以更新localSession当前非活动选项卡中的(也有oldValue事件)。该storageArea包含受影响的存储对象(如果您使用本地和会话存储有用)。

As to "one domain" - yes, the same data will only be available to the same origin(scheme, domain and port).

至于“一个域” - 是的,相同的数据只能用于相同的来源(方案、域和端口)。

Sending the data to server is fully possible. Everything stored in Storage (session and local) is stored as a string. I would recommend encoding it though (JSON is notnecessary as it is already stored as a string). Use f.ex:

将数据发送到服务器是完全可能的。存储在 Storage(会话和本地)中的所有内容都存储为字符串。不过,我建议对其进行编码(JSON不是必需的,因为它已经存储为字符串)。使用 f.ex:

var dataForServer = encodeURIComponent(sessionStorage.getItem(myKey));

Then send it as part of a form, url or by ajax.

然后将其作为表单、url 或 ajax 的一部分发送。

回答by Johan

sessionStorage is available for 1 domain, not 1 tab. So you set information on a page in one tab and you can read it out in the second.Sorry, I thought it worked like this. But it doesn't, you need localStorage or cookies for this to work.

sessionStorage 可用于 1 个域,而不是 1 个选项卡。因此,您可以在一个选项卡中的页面上设置信息,然后可以在第二个选项卡中读出它。对不起,我以为它是这样工作的。但事实并非如此,您需要 localStorage 或 cookie 才能使其工作。

So storing it in a cookie is a viable option, but if you do that, why are you even using sessionStorage?

所以将它存储在 cookie 中是一个可行的选择,但如果你这样做了,你为什么还要使用 sessionStorage?

You could also send the contents of sessionStorage to the server through Ajax, (though you'd have to convert the data to json since you can only send strings)

您还可以通过 Ajax 将 sessionStorage 的内容发送到服务器,(尽管您必须将数据转换为 json,因为您只能发送字符串)

But if you save information on the server anyway, why are you using sessionStorage? The whole point of localStorage and sessionStorage is to save user-specific information the server doesn't have to know about.

但是,如果您无论如何都将信息保存在服务器上,为什么还要使用 sessionStorage?localStorage 和 sessionStorage 的全部意义在于保存服务器不必知道的特定于用户的信息。