存储 Javascript 变量客户端
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5747362/
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
Store Javascript variable client side
提问by Matthieu Napoli
Not duplicate: I've read many questions like this and it always ended up "use PHP or server-side stuff, and watch out for injection/data manipulation".
不重复：我读过很多这样的问题，但结果总是“使用 PHP 或服务器端的东西，并注意注入/数据操作”。
I want to store simple stuff on the client side(save and load), like a Google Map location, and want it to stay between refresh of the page.
我想在客户端存储简单的东西（保存和加载），比如谷歌地图位置，并希望它在页面刷新之间保持不变。
I don't want to use PHP or any server-side thing.
我不想使用 PHP 或任何服务器端的东西。
How can I proceed ?
我该如何继续？
Thanks
谢谢
回答by Zirak
回答by Ekim
If html5 is not a problem I would say localstorage is the way to go:
如果 html5 不是问题，我会说 localstorage 是要走的路：
//set value
localStorage.setItem('todoData', this.innerHTML);
//read value
if ( localStorage.getItem('todoData') ) {
edit.innerHTML = localStorage.getItem('todoData');
}
ripped from http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-learning-about-html5-local-storage/:-)
摘自 http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-learning-about-html5-local-storage/:-)
回答by srinath
There are multiple options to store data in client side - IndexedDB, localstorage, webSQL, SessionStorage, Cookies, etc.
在客户端存储数据有多种选择 - IndexedDB、localstorage、webSQL、SessionStorage、Cookies 等。
IndexedDB
索引数据库
- Data can be queried efficiently. No limitation in size( but volume or disk drivers limits the size )
- It will store in Key-Object format
- It will not be supported in safari browser
- Support Queries
- Asynchronous
- 可以高效地查询数据。大小没有限制（但卷或磁盘驱动程序限制了大小）
- 它将以 Key-Object 格式存储
- safari 浏览器不支持
- 支持查询
- 异步
localstorage
本地存储
- It will store value in key-value format (value should be always String)
- Synchronous
- Helpful if you need to store a small amount of data
- Limited size (Depends on browser)
- 它将以键值格式存储值（值应始终为字符串）
- 同步
- 如果您需要存储少量数据，则很有帮助
- 大小有限（取决于浏览器）
Session Storage
会话存储
- If the user closes the tab, it will clear the data
- 如果用户关闭选项卡，它将清除数据
You can check YDN-DB here
您可以在此处查看 YDN-DB
回答by Random832
The key issue you have to keep in mind is you can't trust the client. If it's okay for the client to ask for any location, then it's okay for you to store the location on the client side. But you can't confirm that the value that you get back from the client side is one you have given to that client.
您必须牢记的关键问题是您不能信任客户。如果客户端可以询问任何位置，那么您可以将位置存储在客户端。但是您无法确认您从客户端获得的价值是否是您提供给该客户的价值。
That's what it meant by "data manipulation" [injection is a special type of data manipulation, in that it is manipulated to include things like end quote marks if you're using it as part of a SQL query or other script.]
这就是“数据操作”的含义[注入是一种特殊类型的数据操作，因为如果您将其用作 SQL 查询或其他脚本的一部分，它会被操作以包含诸如结束引号之类的内容。]
回答by Oscar Godson
I highly suggest using localStorage for a few reasons:
我强烈建议使用 localStorage 有几个原因：
- It's supported by modern browsers, INCLUDING IE.
- You can store up to 5MB of data (10 in IE) where as a cookie is mere 4KBs
- There's lots of libraries to make this easy. One of the most popular is LawnChair: http://westcoastlogic.com/lawnchair/This will actually write to multiple places, including cookies, so that data isn't lost easily.
- 现代浏览器都支持它，包括 IE。
- 您最多可以存储 5MB 的数据（在 IE 中为 10 个），而 cookie 仅为 4KB
- 有很多库可以使这变得容易。最受欢迎的一种是 LawnChair：http://westcoastlogic.com/lawnchair/ 这实际上会写入多个地方，包括 cookie，因此数据不会轻易丢失。
Also, as a note, you can't store objects with localStorage, just like you cant with cookies, however you can convert them. For example, if you want to store a Date()don't store it as new Date()store it as: '\'+Date().getTime()+'\'. Same for other objects.
另外，请注意，您不能使用 localStorage 存储对象，就像您不能使用 cookie 一样，但是您可以转换它们。例如，如果您想存储 aDate()不要将其new Date()存储为store it as: '\'+Date().getTime()+'\'。其他对象也一样。
回答by amit_g
回答by Will
How about storing it in a cookie? For JavaScript I recommend using jQuery, which simplifies a lot of work.
将它存储在cookie中怎么样？对于 JavaScript，我建议使用 jQuery，它可以简化很多工作。
回答by Imran
Take a look at HTML5 Local Storage
