Un mashup con Biblioteche Oggi

Negli ultimi tempi, come avrete notato, sono stata abbastanza silente sul fronte blog: come anticipato, ho avuto delle questioni di vita vissuta da curare e poi il lavoro sull’archivio aperto in Biblioteca e, negli ultimi tempi, anche un lavoro (importante!) sui mashup di cui vi parlerò a breve.

Visto che sono in tema di auto-promozione, dirò che sta per uscire anche il volume con le relazioni al convegno CNBA 2007 “Library 2.0 intorno e oltre l’architettura” (qui il mio post sull’argomento) e in esso sarà presente un mio articolo sui mashup.

Parto da questo per dire anche che ultimamente i mashup si vanno imponendo molto sulla scena delle tecnologie. Vengono visti come pilastro del Web 2.0 – e a ragione, se li si vede come strumenti in grado di mettere la creazione e il remix di informazioni anche nelle mani di coloro che non possiedono particolari skill di programmazione. Ma i mashup rivestono grande interesse anche per le società commerciali, i fondi di investimento e le realtà aziendali più grandi. Certo, non si può dire che siano giunti a un livello di maturazione compiuto, ma le strade che vengono battute lasciano ben sperare.

Nell’ambito bibliotecario ovviamente (sic) le esperienze vengono soprattutto dagli USA; in Italia però è stato fatto un ottimo esperimento per dotare la piattaforma che ospita gli indici della rivista Biblioteche Oggi di una API, cioè di un’interfaccia di programmazione che consente di interrogare il database degli articoli secondo certi parametri e ottenere in risposta le informazioni rappresentate in un determinato formato.

Piero Cavaleri, direttore della Biblioteca della LIUC, è molto interessato agli aspetti tecnologici del Web 2.0, e questa interfaccia, costruita da lui per Biblioteche Oggi, lo dimostra. Vediamo da vicino come funziona. Gli articoli in Biblioteche Oggi (da ora in poi BO) sono descritti con certi metadati (autore, anno e fascicolo in cui sono apparsi, etc.). Normalmente se desiderate conoscere quanto ha scritto un autore, interrogate l’interfaccia umana del database di BO. Se però volete creare un’applicazione (mashup) che metta insieme le informazioni prese dalla rivista con altre, chessò, acquisite da cataloghi, librerie online o siti di social tagging, avete bisogno che la vostra applicazione si rivolga a un’interfaccia dedicata ai programmi, e non a quella dedicata agli utenti umani.

Qui interviene l’API creata da Piero, che consente a un programma di interrogare il database per i parametri che vedete elencati nella pagina esplicativa. Dal momento che l’API utilizza un protocollo di tipo REST, le richieste che devono essere inoltrate, possono prendere la forma di una semplice Url da inviare su HTTP. Il metodo utilizzato da quest’ultimo è GET, il che rende possibile testare la Url anche semplicemente copiandola&incollandola nella barra del browser.

L’output del servizio è JSON, cioè un JavaScript serializzato, light. Le informazioni esposte sono i vari articoli scritti e i loro metadati bibliografici.

I parametri da utilizzare per costruire la Url sono semplicemente il cognome e nome dell’autore e la callback function (ma si può anche appendere un div in cui viene inserita la risposta). E qui viene il bello, perché si può creare un’applicazione molto semplice che interroghi il servizio anche da un client JavaScript, quindi da un piccolo programma che viene fatto girare sul proprio computer, senza bisogno di appoggiarsi a un server. Il problema sta nella Same Origin Policy che prevede, per motivi di sicurezza, che un client JavaScript non possa effettuare richieste di informazioni ad altri domini che non il proprio.

Cioè, se carico la pagina web in cui sta il programma JavaScript sul server AlterVista per la pubblicazione, non posso invocare all’interno del client, una richiesta di informazioni verso un altro dominio, chessò, quello di Google, perché (quasi tutti) i browser pongono delle restrizioni per evitare che nel l’utente possa scaricare inconsapevolmente script malefici. Come workaround a questa limitazione, è stata dunque codificata la tecnica del dynamic script tag, che prevede che la richiesta al sito da cui vogliamo estrarre le informazioni venga racchiusa in un semplice tag script, mettendo in atto un piccolo trucco che confonde il browser facendogli credere che la pagina web sta semplicemente linkando a un file interno posto su un altro server, esattamente come si fa con i fogli di stile o, per l’appunto, i file JavaScript.

In pratica, dunque, si utilizza in combinata la funzione di callback e l’output in JSON per chiamare da un sito web le informazioni relative alle pubblicazioni di un certo autore, semplicemente embeddando la Url costruita con i parametri richiesti, nella pagina da cui parte la richiesta.

L’inizio della pagina web: qui viene inserito, oltre ai tag di apertura della pagina e al titolo, il titoletto interno alla pagina; vengono anche linkati CSS esterni.

<html>
  <head>
    <title>
      Mashup per Biblioteche Oggi
    </title>
    <link type="text/css" media="all" rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <h3>I pochi articoli scritti da me per "Biblioteche Oggi":</h3>

Viene poi creata la funzione che estrae dalla callback le informazioni che ci interessa mostrare, come il titolo dell’articolo e gli altri dati correlati.

<script type="text/javascript">

function get_info(obj) {

var i;
for (i=0; i < obj.titoli.length; i++)
{
var solotitoli = obj.titoli[i][0];
var soloanno = obj.titoli[i][1];
var solonumero = obj.titoli[i][2];
var solopagine = obj.titoli[i][3];

var abstract = obj.titoli[i][6];
if (abstract == 0) {
abstract = "sorry! no abstract";
}
else {
abstract = "wow! abstract!";
};

“get_info” è esattamente il nome che ho dato alla funzione di callback. In questo esempio, dunque, estraggo dai risultati della chiamata (cioè della Url inviata al server di BO) il titolo, l’anno di pubblicazione, il fascicolo, le pagine e l’informazione relativa alla presenza di abstract (non c’è bisogno di effettuare prima un parsing dei risultati, come sarebbe se essi fossero rappresentati in XML, proprio perché il loro formato, JSON, è già JavaScript che può essere direttamente utilizzato dalla funzione). La prima parte (quella con la i, per capirci), serve a ripetere per ogni item trovato l’operazione di estrazione dei dati. Ecco l’ultima parte:

document.write('<div id="content"><strong>Titolo: </strong>' + solotitoli + "<br>"
+ "<strong>Anno: </strong>" + soloanno + "<br>" + "<strong>Fascicolo: </strong>" +
solonumero + "<br>" + "<strong>Pagine: </strong>" + solopagine + "<br>" +
"<strong>C'&egrave; anche un abstract? </strong>" + '<span id="abstract">' +
abstract + "</span></div>");
}
}
</script>

<script type="text/javascript" src="http://www.biblio.liuc.it/scripts/bibloggi/
ricercheJS.asp?tipo=autore&aut=BIANCU BONARIA&callback=get_info"></script>

<span id="footer"><p>Diritti: Biblioteche oggi, Universit&agrave; Cattaneo
 - LIUC, Copyright</p></span>

  </body>
</html>

Ecco quindi che completiamo la funzione aperta con un comando che serve a scrivere materialmente nella pagina dei risultati che verrà generata dinamicamente, i tag HTML necessari a rappresentare graficamente le informazioni e, infine, inseriamo la Url contenente la richiesta di callback, come abbiamo detto mascherata dal tag HTML adoperato per caricare documenti esterni alla pagina.

Il risultato? Potete vederlo sia lanciando una semplice Url nel vostro browser sia aprendo una pagina web con i risultati, per esempio per i miei pochi articoli (poca soddisfazione) [Url e pagina] o per gli articoli scritti proprio da Piero Cavaleri (molta soddisfazione) [Url e pagina]. Utilizzando Firefox si vede anche qualche effetto speciale che Explorer non mostra (per i curiosi: l’effetto hover su div e span). Con queste due righe di codice e soprattutto con l’interfaccia creata da Piero, semplice e funzionale, potete generare pagine di risultati sempre aggiornati, senza bisogno di preoccuparvi di gestire il copia&incolla delle pubblicazioni ogni qual volta escono (potete anche generare citazioni in formati particolari, il layout è a piacere ;-) ).

Se provate a vedere il sorgente della pagina, noterete come non vi sono né i tag né le informazioni che vedete nella interfaccia utente della pagina dei risultati. Questo è dovuto al fatto che quando la pagina viene chiamata dall’utente si attiva on the fly la richiesta  della callback e i risultati vengono generati attraverso i comandi Javascript (inclusi quelli che richiedono di creare i tag HTML in cui vanno i vari “titolo”, “anno” etc.). Volete la controprova?

Avrete senz’altro già non solo sentito parlare di ma anche provato ad installare Chrome, il browser di casa Google che vanta un editor JavaScript à la Firebug incluso. Provate ad aprire le due paginette di cui sopra in Chrome e poi a cliccare sull’iconcina a forma di foglio subito alla fine della casella dell’Url, e poi a scegliere Opzioni per sviluppatori -> Console JavaScript. Ecco la magia: il tag contenente la callback viene posto al principio della pagina, e vedete finalmente tutti i tag HTML e gli stili CSS ad essi applicati, come se… ci fossero davvero! ;-) Con questo strumento potete divertirvi per cambiare on the fly valori agli stili o all’HTML così come al JavaScript, studiare il DOM e utilizzarlo per altro codice e fare le vostre prove.

Naturalmente quello che avete visto, per dirla con Magritte, non è un mashup (almeno se si segue la definizione di ProgrammableWeb che vuole i mashup ricombinare le informazioni da due o più fonti) ma può essere una buona base per crearlo! Mettete insieme questo piccolo pezzo di codice con un altro che sfrutti per esempio le API pubbliche di del.icio.us o di Amazon, e il gioco è fatto.

Se volete provare, codice e stili sono liberi (mi farebbe solo piacere se mi segnalaste per cosa li userete) mentre ricordatevi di attribuire i diritti delle informazioni che ricavate da Biblioteche Oggi.