如何使用jQuery存储前端数据？

Question

这是一个相当广泛的问题，而不是特定于代码。我正在寻找那些知道如何实现这一要求的人的意见

我正在构建一个人们可以排列音乐对象的音乐应用程序。音乐对象看起来像

url:
name:
views:

用户可以通过单击列表将此歌曲排队等待播放。这时我想构建一个音乐对象队列，然后开始播放。一个非常类似的例子是groovehark所做的：

我非常希望实现具有以下功能的相同功能

• 即使浏览器关闭也能保持队列
• 能够检索任何队列（如果存在）
• 能够随机播放，强制对队列中的对象进行排序以进行播放

我对此很新，所以不知道在哪里存储这些数据。请帮助我了解实施此操作需要学习的内容。

Answer 1

这是一个相当广泛的问题！如果您正在开发HTML5应用程序，您可能希望调查DOM存储设施，例如localStorage和sessionStorage（主要关注localStorage以满足您的需求/系统要求）：https://developer.mozilla.org/en-US/docs/DOM/Storage

以下是一些有用的资源/信息：

http://ejohn.org/blog/dom-storage/

http://viralpatel.net/blogs/introduction-html5-domstorage-api-example/

http://msdn.microsoft.com/en-us/library/cc197062(v=vs.85).aspx

如果不这样做，您可能需要查看Cookie：https://developer.mozilla.org/en-US/docs/DOM/document.cookie但我怀疑cookies会因为您可以存储/保存的数量限制而向您提供您需要/想要的内容

Answer 2

localstorage是你最好的选择

http://www.w3schools.com/html5/html5_webstorage.asp

但您可以使用以下内容进行填充并使其与非html5浏览器一起使用：

https://gist.github.com/350433

Answer 3

如果您只定位HTML5浏览器，则可能需要查看以下内容：https://developers.google.com/web-toolkit/doc/latest/DevGuideHtml5Storage

Answer 4

由于我无法看到对旧浏览器支持的要求，我建议远离localStorage，因为它有一些问题，比如它正在执行文件IO并且它是同步的。

相反，您可以查看indexedDB，它有点难以使用，但就我所知，在各方面都更好。

https://developer.mozilla.org/en-US/docs/IndexedDB

Answer 5

正如其他人已经回答的那样，localStorage可能是你最好的选择..但如果你不想，你不必直接使用它。查看AmplifyJS'amplify.store，它是localStorage和sessionStorage的一个很好的包装器，它易于使用，并使用功能检测在不支持localStorage的浏览器上优雅地降级（我忘记了什么相反，它会使用，但它会存储您的数据。也许是Cookie？）

无论如何，值得研究。 http://amplifyjs.com/api/store/

Answer 6

我过去曾使用jStorage来达到此目的。它是一个很好的插件，它提供了本地存储的包装器，其中包含Internet Explorer旧版本中的可用和userData行为。