jQuery如何读取json缓存？

Question

根据此答案，我为json数据设置了缓存：

session_start();
if(isset($_SESSION['dataCache'])) {
    echo json_encode($_SESSION['dataCache']);
} else {
    $file = 'data.json';
    if (!is_file($file) || !is_readable($file)) {
        die("File not accessible.");
    }
    $contents = file_get_contents($file);
    $_SESSION['dataCache'] = json_decode($contents, true);
    echo $contents;
}

现在，我想通过以下代码读取从javascript缓存的内容：

if(localStorage.getItem("dataCache")) {
    data = JSON.parse(localStorage.getItem("dataCache"));

但是，问题是localStorage.getItem("dataCache")返回null。

如何从JavaScript读取PHP会话中创建的缓存？

Answer 1

$_SESSION[]将存储在服务器端（php）。

如果要通过JavaScript（客户端）访问它，请使用Ajax返回JSON，然后使用JavaScript对其进行解析。 如果您需要浏览器保留副本，则在从服务器中检索副本后将其存储在localStorage 。

Answer 2

问题是$_SESSION值只能在服务器端设置和使用。 如果要在客户端JavaScript上使用此内容，则必须向php服务器发送一个请求，以获取dataCache值，然后将其设置在local storage 。 您可以使用像

$.ajax({url: "getDataCache.php", success: function(result){
        localStorage.setItem('dataCache', result);
    }});

在getDataCache.php您需要执行以下操作

echo json_encode($_SESSION['dataCache']);

之后

if(localStorage.getItem("dataCache")) {
    data = JSON.parse(localStorage.getItem("dataCache"));

将工作

关于此问题的好文章http://www.devshed.com/c/a/php/html5-client-side-cache-in-php/

希望能帮助到你 ：）

Answer 3

在这个文章你提到的正确答案有2个部分。 服务器端说明如何将信息添加到$ _SESSION并发送回视图。 客户端说明了如何获取该信息并将其存储在客户端缓存中。 您错过了客户端。 答案是关于ajax调用的问题，尽管responseText是json，您需要将其转换为字符串。 这部分

$.ajax({
    ...
    success: function (res) {
        localStorage.setItem("dataCache", JSON.stringify(res));
    },
    ...
});

然后您可以通过以下方式获取缓存的数据

if(localStorage.getItem("dataCache")) {
    data = JSON.parse(localStorage.getItem("dataCache"));
} else {
    // Make ajax call, fetch object and store in localStorage in the success or done callbacks as described above
}

请注意，在本部分中，您实际上要测试缓存上是否有任何内容，否则发送ajax调用获取信息并存储在缓存中。 所以就像是吼叫

if(localStorage.getItem("dataCache")) {
    data = JSON.parse(localStorage.getItem("dataCache")); // get from cache
} else {
    $.ajax({
        ...
        success: function (res) {
            var dataToCache = JSON.stringify(res);
            localStorage.setItem("dataCache", dataToCache); // set cache
            data = JSON.parse(dataToCache); // set data
        },
        ...
    });
}

并请注意，如参考文献中所述，此解决方案可在HTML5上使用。