Exchange rate in Javascript e Fixer.io

Ho trovato un ottimo sito che espone in formato JSON i cambi di varie valute straniere: Fixer.io.

Non è totalmente in tempo reale, ma ho un ritardo di solo 24h; quindi direi che essendo gratuito può andare più che bene.

Vediamo come interrogare questo servizio con Javascript, in modo da visualizzare i cambi nella pagina.

Per farlo useremo:

• jQuery
• AJAX
• JSONP, in quanto dobbiamo fare una richiesta cross-domain

Questa la funzione:

function getCurrencyExchange() {
    $.ajax({
        crossDomain: true,
        type: "GET",
        dataType: "jsonp",
        url: "http://api.fixer.io/latest",
        success: function (res) {
            var html = "<ul>";
            $.each(res.rates, function (key, val) {
                html += "<li>" + key + ": " + val + "</li>";
            });
            html += "</ul>";
            $("#ajax_currency").html(html);
        },
        error: function (err) {
            $("#ajax_currency").html("Errore nel reperire i dati");
        }
    });
}

Non ho usato nessuna sistema di templating, quindi ho inserito il codice HTML da visualizzare direttamente nella funzione.

Così facendo, inoltre, recuperiamo i dati in maniera asincrona senza bloccare la pagina.

Questa funzione titrerà fuori tutte le valute disponibili; però è possibile specificarle nell'url del servizio.

Con latest, inoltre, prediamo solo l'ultimo; ma possiamo anche specificare una data da cui partire per i dati storici.

Infine, di default la base è l'EURO, ma è possibile spceificare altre valute.

Non vi faccio tutti gli esempi perchè quelli sul sito sono molto esplicativi.

Enjoy!