一尘不染

缓存JSON响应

json

我使用一些GeoIP服务在页面上放置国家/地区标记,具体取决于国家/地区IP。我需要为网站上的所有页面缓存JSON响应。

将此代码放入header.php

$.getJSON('http://smart-ip.net/geoip-json?callback=?', function(data) {
  $('#flag').html("<a class='fancybox-inline int' href='#international'><img src='/images/flags/"+data.countryCode+".png'></a>");
  }

是否可以将其缓存$.ajaxSetup({ cache: true })?-似乎不起作用。

或者使用HTML5 localStorage可能更好,但是我不确定该怎么做。

我也尝试了JSONCache插件,但是对我来说不起作用。


阅读 241

收藏
2020-07-27

共1个答案

一尘不染

您可以这样使用localStorage:

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

if (!smartIp) $.getJSON('http://smart-ip.net/geoip-json?callback=?', function (data) {
    smartIp = localStorage.setItem('smartIp', JSON.stringify(data));
});

演示

因此,在您的特定情况下,应在header.php页面中使用以下代码:

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

if (!smartIp) $.getJSON('http://smart-ip.net/geoip-json?callback=?', function (data) {
    smartIp = localStorage.setItem('smartIp', JSON.stringify(data));
    $('#flag').html("<a class='fancybox-inline int' href='#international'><img src='/images/flags/" + data.countryCode + ".png'></a>");
});
else $('#flag').html("<a class='fancybox-inline int' href='#international'><img src='/images/flags/" + smartIp.countryCode + ".png'></a>");
2020-07-27