La réponse JSON du cache

Question

L'utilisation de certains services GeoIP pour placer un indicateur de pays sur des pages dépend de l'adresse IP du pays. Et j'ai besoin de mettre en cache la réponse JSON pour toutes les pages de mon site.

Ce code placé dans 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>"); 
    } 

Est-il possible de mettre en cache avec $.ajaxSetup({ cache: true })? - semble ne pas fonctionner.

Ou probablement préférable d'utiliser HTML5 localStorage, mais je ne suis pas sûr de savoir comment faire.

J'ai également essayé le plugin JSONCache, mais cela n'a pas fonctionné pour moi.

Answer 1

Vous pouvez utiliser localStorage comme ça:

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

Ainsi, dans votre cas, vous devez utiliser ce code dans votre header.php page:

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() est équivalent à

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

Dans ce formulaire, vous pouvez ajouter des paramètres supplémentaires, tels que cache:true, ou tout autre .ajax $ paramètres vous pourriez avoir besoin.