Кэш Ответ JSON

Question

Я использую некоторый сервис 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 плагин, но это не сработало для меня.

Answer 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)); 
}); 

DEMO

Таким образом, в вашем конкретном случае, вы должны использовать этот код в 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>"); 

Answer 2

$.getJSON() эквивалентно

$.ajax({ 
    dataType: "json", 
    url: 'http://smart-ip.net/geoip-json/ip_address', 
    data: data, 
    success: function(data){ // do something here } 
}); 

В этой форме вы можете добавить дополнительные параметры, такие как cache:true, или любые другие $ .ajax параметры, которые вам могут понадобиться.