Html 如何制作本地离线数据库
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16815942/
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
How to make a local offline database
提问by samueldple
I'm making a to-do list application with HTML, CSS, and JavaScript, and I think the best way for me to store the data would be a local database. I know how to use localStorageand sessionStorage, and I also know how to use an online MySQLdatabase. However, this application must be able to run offline and should store its data offline.
Is there a way I could do this with just HTML and JavaScript?
我正在使用 HTML、CSS 和 JavaScript 制作待办事项列表应用程序，我认为存储数据的最佳方式是本地数据库。我知道如何使用localStorage和sessionStorage，我也知道如何使用在线MySQL数据库。但是，此应用程序必须能够脱机运行并应脱机存储其数据。
有没有办法只用 HTML 和 JavaScript 来做到这一点？
Responding to comments:
回复评论：
"You said you know how to use
localStorage... so what seems to be the problem?"
“你说你知道怎么用
localStorage……那好像有什么问题？”
@Lior All I know about localStorageis that you can store a single result, as a variable whereas I wish to store a row with different columns containing diffenent data about the object. However, can localStoragehold an object and if so is it referenced with the usual object notation?
@Lior我所知道的localStorage是，您可以将单个结果存储为变量，而我希望存储具有不同列的行，其中包含有关对象的不同数据。但是，可以localStorage持有一个对象，如果是这样，它是否用通常的对象表示法引用？
Any implementation will probably depend on what browser(s) your users prefer to use.
任何实现都可能取决于您的用户喜欢使用的浏览器。
@paul I think chrome will be most popular.
@paul 我认为 chrome 将是最受欢迎的。
Okay, I would like to clarify that what I was asking was indeed How can I do this with JavaScript and HTMLrather than Is there a way I could do this with just HTML and JavaScript?. Basically, I wanted a type of SQL database that would save its contents on the user's machine instead of online.
好的，我想澄清一下，我要问的确实是如何使用 JavaScript 和 HTML来做到这一点，而不是仅使用 HTML 和 JavaScript 就可以做到这一点？. 基本上，我想要一种 SQL 数据库，可以将其内容保存在用户的机器上而不是在线上。
What solved my problem was using WebDB or WEBSQL (I think it was called something like that that).
解决我的问题的是使用 WebDB 或 WEBSQL（我认为它被称为类似的东西）。
回答by Kevin
I'm about 3 years late in answering this, but considering that there was no actual discussion on the available options at the time, and that the database that OP ended up choosing is now deprecated, I figured i'd throw in my two cents on the matter.
我回答这个问题晚了大约 3 年，但考虑到当时没有关于可用选项的实际讨论，而且 OP 最终选择的数据库现在已被弃用，我想我会投入我的两分钱就此事。
First, one needs to consider whether one actually needs a client-side database. More specifically...
首先，需要考虑是否真的需要客户端数据库。进一步来说...
- Do you need explicit or implicit relationships between your data items?
- How about the ability to query over said items?
- Or more than 5 MBin space?
- 您需要数据项之间的显式或隐式关系吗？
- 查询上述项目的能力如何？
- 或者超过5 MB的空间？
If you answered "no" to all of the above, go with localStorage and save yourself from the headaches that are the WebSQL and IndexedDB APIs. Well, maybe just the latter headache, since the former has, as previously mentioned , been deprecated.
如果您对上述所有问题的回答都是“否”，请使用 localStorage，从而避免 WebSQL 和 IndexedDB API 的麻烦。好吧，也许只是后者令人头疼，因为如前所述，前者已被弃用。
Otherwise, IndexedDB is the only option as far as native client-side databases go, given it is the only one that remains on the W3C standards track.
否则，就原生客户端数据库而言，IndexedDB 是唯一的选择，因为它是 W3C 标准轨道上唯一的选择。
Check out BakedGoodsif you want to utilize any of these facilities, and more, without having to write low-level storage operation code. With it, placing data in the first encountered native database which is supported on a client, for example, is as simple as:
如果您想使用这些工具中的任何一个，而无需编写低级存储操作代码，请查看BakedGoods。有了它，例如，将数据放入客户端支持的第一个遇到的本机数据库中，就像这样简单：
bakedGoods.set({
data: [{key: "key1", value: "val1"}, {key: "key2", value: "val2"}],
storageTypes: ["indexedDB", "webSQL"],
//Will be polyfilled with defaults for equivalent database structures
optionsObj: {conductDisjointly: false},
complete: function(byStorageTypeStoredKeysObj, byStorageTypeErrorObj){}
});
Oh, and for the sake of complete transparency, BakedGoods is maintained by this guy right here :) .
哦，为了完全透明，BakedGoods 由这里的这个人维护:)。
