HTML5 Web SQL 数据库的问题

Question

我的公司正在转向一种新的架构，以及一种为移动设备提供服务的模型。我们的应用程序传统上是基于Web的（HTML5/CSS3/JS/PHP/MYSQL），因此我们希望能够将其移植到移动平台上，而不必重新发明轮子（Cordova），并且在桌面上以独立的方式（AppJS）运行，这样我们就不必担心浏览器相关的错误。我们还正在从PHP转向NodeJS，以使这更可行。

问题在于我们的用户需要能够离线使用我们的应用程序，并且没有实际限制可以存储多长时间或多少数据，然后再将其“同步”到我们的服务器。

使用AppJS，这不是问题，因为他们可以在sqlite数据库中存储所需的任意数量的数据。但是，我发现了有关WebSQL数据和cordova/phonegap的5MB配额问题。这对于我们的业务需求显然存在明显的技术挑战。

我知道有几个插件可以让您使用sqlite数据。原始的sqlite插件（https://github.com/davibe/Phonegap-SQLitePlugin）缺乏Android文档，而另一个（https://github.com/chbrody/Cordova-SQLitePlugin）要求我指定数据限制，这显然是不可能的。因此，我只剩下很少的选择，其中之一是将数据库分成多个5MB段，由JS包装器控制。

您是否可以在iOS和Android上将较大的数据结构划分为多个5MB websql数据库而没有问题？

在iOS和Android上的websql数据库总数是否有限制？

您是否推荐我们查看其他选项？我们需要能够使用现有的HTML5和CSS进行前端！

- Andrew Rhyne

---

你是如何在原始浏览器应用程序中解决这个问题的？ - JustDanyul

在原始的浏览器应用程序中，我们使用Server2Go堆栈来实际“托管”应用程序在他们的机器上（http://www.server2go-web.de/）。这引起了各种问题（主要是在本地运行mysql方面）。WAMP并不是为生产而设计的，Apache / MySQL / PHP也不是为在不断更改其配置的平台上运行而设计的，因为我们无法控制客户选择安装可能与此堆栈冲突的软件），这也是我们正在切换架构的原因之一。 - Andrew Rhyne

IndexedDB怎么样？它没有限制。 - Kyaw Tun

Answer 1

针对Android平台，您可以创建一个本地应用程序，然后使用Webview来显示前端（如果保持HTML真的很重要），然后使用JavaScript桥接器允许WebView中的内容与您的本地应用程序进行交互。

从您所描述的应用程序来看，我认为您最好实际上创建一个本地应用程序。正如您在评论中所说，您更改平台的原因之一是缺乏控制。那么，为什么要通过将各种混合应用程序框架引入到您的堆栈中立即重新打开这个问题呢？

长话短说，如果您只采用本地方法，您将拥有完全控制（并且很可能会获得更好的产品）。

- JustDanyul

---

这是我目前正在研究的事情。利益相关者希望能够尽可能地重用现有的HTML/CSS，并且我们所有的开发人员都熟悉JavaScript。我们整个新平台都运行JavaScript（前端使用AngularJS，后端使用NodeJS），因此如果我们能找到一个使用JavaScript而不是Objective-C或Java的解决方案，那将是非常好的。 - Andrew Rhyne

我明白你的意思，这在移动开发中非常普遍。业务赞助商不想花费资源将已经存在的代码移植过来，但最终却花费了几乎同样的资源来创建一个混乱的机器来使其与“我们所拥有的”相容（加上不知道用了多少片鸭带 :(）。祝你在项目中好运，希望不会太痛苦。 - JustDanyul

实际上，这里唯一的问题就是苹果公司。他们严格的QA流程会产生各种（看起来）不必要的技术挑战。Android很容易，但由于苹果在平板市场拥有如此大的份额，而我们的客户显然希望使用平板电脑，因此我们必须遵守他们（荒谬的？）规格要求。 - Andrew Rhyne

但是混合应用程序很可能会经过完全相同的QA流程？http://stackoverflow.com/questions/12068192/app-store-approval-process-for-hybrid-apps - JustDanyul

是的，我知道。这就是问题所在，不是吗？我很想能够直接将NodeJS移植到Objective C并构建一个包装器。这本身就可以成为另一个产品。 - Andrew Rhyne

好的，我有点迷失你实际上想要什么了伙计（我以为你在探索PhoneGap SQLite插件作为潜在解决方案，这些是混合应用程序）:D 我还有5分钟就要开会了。祝你和你的团队好运，找到适合你们的解决方案 :) - JustDanyul

Answer 2

为了获得一个真正的跨平台、跨浏览器的关系解决方案，它可以离线工作并具备必要的存储容量，我建议使用：SequelSphere。

由于它是一个100%的JavaScript解决方案，因此在每个配置中都可以使用，而不需要为每个配置编写不同的代码库。此外，它使用IndexedDB（如果可用，则使用LocalStorage）将其数据存储在关系表中。我认为大多数浏览器没有IndexedDB的存储限制。根据以下信息，我认为Firefox可能有一个初始的50MB限制：IndexedDB中的最大大小。

另外，还有一个名为“Change Trackers”的新功能，在数据同步过程中显着帮助跟踪更改（插入/更新/删除）到表格，然后在你需要时向你报告它们。

作为额外的奖励，与WebSQL不同，SequelSphere非常友好的JSON。创建表格再简单不过了。

db.catalog.createTable({
    tableName: "EMPL",
    columns: [ "EMPL_ID", "NAME", "AGE", "DEPT_ID" ],
    primaryKey: [ "EMPL_ID" ],
    data: [
        [0,"Bob",32,0],
        [1,"John",37,2],
        [2,"Fred",28,1]
    ]
});

查询数据很容易：

var res = db.query("SELECT name, age, dept_id FROM empl WHERE Dept_ID = 2");

插入/更新/删除数据很容易：

db.insertRow("empl", [3, "Sue", 26, 2]);
db.updateRow("empl", [3, "Suzy", 26, 2]);
db.deleteRow("empl", [3, "Suzy", 26, 2]);

需要注意的一点是：由于这将用于离线应用程序，请确保将整个目录或每个表的“持久性范围”设置为“SCOPE_LOCAL”：

db.catalog.setPersistenceScope(db.SCOPE_LOCAL);
//  -or-
db.catalog.getTable("empl").setPersistenceScope(db.SCOPE_LOCAL);

• 基础文档：SequelSphere 基础
• "本地存储"支持文档：本地数据存储和持久化
• 这是 API：SequelSphere API

如果您有任何问题，请发送电子邮件至 SequelSphere 支持。

为了完全透明，我是 SequelSphere 的一部分，它似乎非常好地回答了您的问题... ;)

- John Fowler

---

看起来不错，但我在网站上找不到任何费用信息。只有一个请求价格的表格。这并不理想... - Luqmaan

Answer 3

一般来说，我建议使用lawnchair，这样您就可以实现无关实现的目标。 http://brian.io/lawnchair/adapters/

您是否可以将较大的数据结构分成多个5MB的websql数据库，在iOS和Android上没有任何问题？

在我了解lawnchair之前，我使用WebSQL实现了this, 我有点后悔了。 WebSQL数据库可以增长超过5MB。我不确定真正的最大值是多少，但我已经将我的Phonegap应用程序设置为100 * 1024 * 1024，并且在Honeycomb Android上没有遇到任何问题。

对于iOS，您可以使用PhoneGap / iOS上的SQLite数据库-可能超过5mb。

- Luqmaan

---

为了使用第三方包装器，我会选择http://dev.yathit.com/api-reference/ydn-db/storage.html，它具有更好的性能和支持IndexedDB、websql。 - Kyaw Tun

@KyawTun 兄弟，你在链接到自己的网站，难怪你会选择它。 - Luqmaan