Meraviglie di JSON + jQuery per la lista delle pubblicazioni

Oggi guardando il portale del repository di ateneo delle pubblicazioni (PORTO) ho scoperto la possibilità di esportare i dati in vari formati.

La mia attenzione è stata attirata da un formato in particolare: JSON. Si tratta di formato, sostanzialmente alternativo a XML, che è definito come un sottoinsieme di Javascript / ECMAScript. Mi è venuta la curiosità di verificare quanto sia facile integrare in una pagina i dati forniti in JSON, in sostanza realizzando una sorta di mash-up che preleva dati da una sorgente esterna.

….la risposta è facilissimo, provare per credere.

Per caricare il contenuto JSON ho utilizzato la libreria jQuery, che mette a disposizione la funzione $.getJSON() per caricare il contenuto di una risorsa ed elaborarla. L’aspetto interessante è che quel metodo è in grado di caricare informazioni da un sito diverso da quello di origine dalla pagine (cosa di solito proibita in JS per evitare problemi di cross-site scripting).

La funzione che legge i dati è veramente semplice (grazie a jQuery):

  1. function loadPortoPublications(first,last,id,processPublications){
  2.   signature = last+"=3A"+first+"=3A"+id+"=3A";
  3.   resource = "http://porto.polito.it/cgi/exportview/creators/"+signature + "/JSON/"+signature + ".js";
  4.   $.getJSON(resource + "?callback=?", processPublications );
  5. }

Le righe 2 e 3 costruiscono l’URL della risorsa a partire da nome (first), cognome (last) e matricola (id). Tutto il lavoro è svolto dalla riga 4 che recupera i dati in formato JSON e li passa alla funzione (callback) processPublications() per l’elaborazione ed il rendering nella pagina.

Il problema dell’accesso cross-site, che normalmente è proibito dalla same-domain-policy, viene risolto aggiungendo semplicemente quel “?callback=?” alla fine dell’URL (riga 4).

In questo modo è possibile avere un rendering personalizzato delle pubblicazioni all’interno della popria pagina. Ad esempio se vogliamo avere una semplice lista con autori e titoli possiamo scrivere una funzione come la seguente:

function processPublications(data){
     $("#output").text("");
     $.each(data,function(i,p){
       $("#output").append("<li>" + p.authors_string + "<br/><b>" + p.title + "</b><br/>");
     });
}

Il risultato assemblato in una pagina HTML nuda e cruda è questo.

Annunci

2 thoughts on “Meraviglie di JSON + jQuery per la lista delle pubblicazioni

  1. Molto interessante. Grazie per la segnalazione. Potrebbe essere utile per creare una FAQ di “riutilizzo dei dati” da inserire su PORTO.

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...