读取和写入移动应用程序的JSON文件

Question

我正在开发一款移动应用。由于我想要一个可以在多个平台上运行的解决方案，我从Cordova开始。由于我需要处理大量数据和许多观点，因此我决定使用Ember。

我需要使用三个不同的JSON数据集，这些数据集在数据库中经常更新。要使移动应用程序脱机工作，我将必须存储JSON数据，并在数据库更改时更新它们。

问题

1. 如何从其他服务器检索JSON（CORS被阻止）？
2. 如何将检索到的JSON保存在设备上？ [HTML5 LocalStorage（首选）或FileAPI]
3. 如何阅读JSON文件并将数据作为模型发送到模板？ （我猜Ember.$.getJSON可以做到这一点）

欢迎任何帮助。谢谢！

更新1

1. 由于我使用Ember-data遇到了很多问题，我没有在我的应用中使用它。
2. 使用ajax
找到了跨域的链接

更新2

CORS只能通过JSONP或在服务器的响应中设置ACCESS-CONTROL-ALLOW-ORIGIN来解决（我尝试了很多其他解决方案，但都失败了）

由于api在我的服务器中，我做了后者。

对于 2 和 3 ，我想我可以使用this SO question

Answer 1

这是我发现的：

1. 来自不同域中服务器的JSON数据 您无法从另一个域中的服务器读取JSON数据。这是因为浏览器中实现了Same-origin policy。浏览器将检索您的JSON，但不允许您访问相同的内容。这个问题有两个解决方案（AFAIK）：

   • 使用JSONP - 我没有详细介绍，但有很多可用的链接。

   • 允许来自服务器的CORS - 当服务器发送JSONified数据时，您可以为ACCESS-CONTROL-ALLOW-ORIGIN添加其他标头。从服务器检索JSON后，浏览器会检查此标头是阻止还是允许CORS。我使用了一些装饰器来添加crossdomain标题，然后在浏览器中成功读取了我的数据。

2. 保存json数据 HTML5让一切变得更轻松。在您的JavaScript中，您只需使用：

   localStorage["application.state.data"] = JSON.stringify(json);
   

   或

   localStorage.setItem("application.state.data", JSON.stringify(json));
   

3. 检索功能相同

   var data = JSON.parse(localStorage["application.state.data"]);
   

   或

   var data = JSON.parse(localStorage.getItem("application.state.data"));