如何设置可以脱机访问的JSON数据集?

时间:2016-07-13 05:53:03

标签: javascript jquery html json search

我正在尝试构建一个包含多个页面的移动应用程序,用户可以使用这些页面并离线导航。它将具有搜索功能,以查找自身内的某些页面。在以前的问题中,我被告知设置JSON数据集是最好的方法;但是,我读到的关于JSON数据集和访问它们的每个示例或教程或书籍都与来自服务器和浏览器的通信有关。如何设置JSON数据集并设置用户与其交互或调用via以脱机访问JSON数据集的能力?我只是假设它与设置它不同,就像我到目前为止看到的例子

2 个答案:

答案 0 :(得分:0)

您可以使用sqlite保存已抓取的数据。因此,当用户在线或您只获取新内容时,您可以决定再次获取整个数据:

https://developer.android.com/training/basics/data-storage/databases.html

另一种可能性是将您的数据下载为.json文件并将其加载到您的应用中。因此,您需要用户的读写权限。

答案 1 :(得分:0)

您可以使用localStorage在浏览器中存储JSON数据。

假设您在服务器上有一个名为data.json的文件,其中包含以下内容:

[{ "name":"Name1", "surname":"Surname1" },
 { "name":"Name2", "surname":"Surname2"},
 { "name":"Name3", "surname":"Surname3" },
 { "name":"Name4", "surname":"Surname4" }]

当用户第一次访问移动应用程序 时,您可以调用服务器,获取JSON数据并使用localStorage将其存储在浏览器中:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $.getJSON("data.json", function (data) {
            localStorage.setItem('users', JSON.stringify(data));
        });
    });
</script>

Google Chrome - &gt;资源 - &gt;本地存储:

localStorage in Google Chrome

既然您的JSON对象存储在本地,您可以从本地存储中检索它并在应用程序中使用它而无需连接到服务器。请确保始终进行空检查以确保数据仍然存在于本地,如果它你不需要发起服务器呼叫:

var users = JSON.parse(localStorage.getItem('users'));

if (users != null) {
    for (var i = 0; i < users.length; i++) {
        alert(users[i].name + " " + users[i].surname);
    }
}