Lavorando su un app con Phonegap mi sono imbattuto in una rogna non da poco, risolta grazie a qualche invocazione dell’Altissimo e un paio d’ore di sbattimento.
La problematica era di risolvere l’annoso problema dell’errore di console di Chrome Origin null is not allowed by Access-Control-Allow-Origin.
Leggendo vari post su internet, la problematica è capitata a tantissima gente e la risoluzione della stessa non sembra così palese come può sembrare.
Io stesso, soprattutto nei blog italiani, non ho trovato molte soluzioni rapide.
A parte la quantità indecente di soloni che si beano della propria conoscenza, cosa che mediamente fa incazzare come quando si paga l’IMU, che preferiscono rompere i maroni ore ed ore, invece che dare velocemente la soluzione, come se far faticare la gente fosse, in Italia, uno sport nazionale. Nei blog americani, invece, ci si imbatte più spesso in persone più malleabili e meno snob.
Veniamo velocemente al codice:
$.ajax({ url:"http://www.vostrodom.it/pagina.asp", type:"GET", dataType:"json", data:"id=" + ID }) [...]
Molto semplicemente, una bella chiamata con jQuery.ajax, ad una pagina sul vostro sito, con il passaggio di una variabile querystring id.
Se usate Google Chrome, noterete un bel messaggio di errore, che avvisa che non possono essere effettuate chiamate CrossDomain, ossia fuori dal dominio della pagina stessa.
La problematica avviene soprattutto se avete lanciato una pagina da file:\\ .
Come ovviare al problema? Usando come dataType:jsonp e non json.
Occhio, le problematiche, usando questo sistema, diventano altre, però, per lo meno, una rogna, di dosso, ve la togliete. Per esempio, scordatevi il passaggio POST dei dati: con JsonP avvengono tutte via GET, con tutte le problematiche di dati e sicurezza che ne derivano. Se queste noie non vi interessano, risolvete in fretta il problema.
Risolto un problema, però, ne viene fuori un altro: jsonp utilizza una funzione javascript per ovviare al Domain Crossing. Non modificando niente, potrebbe venire fuori un errore del tipo Uncaught SyntaxError: Unexpected token.
Un passo alla volta.
Poniamo il caso che il vostro file json sia come nell’esempio seguente:
{ "glossary": { "title": "example glossary" } }
Al file json manca un quid, ossia una funzione che conglobi tutto.
Modificate il vostro json aggiungendo, ad esempio, readJson([vostro-codice-json]).
readJson({ "glossary": { "title": "example glossary" } })
Dopo di che, andiamo nel codice javascript a dirgli che la funzione callback che deve leggere si chiama readJson.
$.ajax({ url:"http://www.vostrodom.it/pagina.asp", type:"GET", dataType:"json", data:"id=" + ID, jsonpCallback: "readJson" }) [...]
A questo punto, tutti gli odiosi messaggi d’errore della console dovrebbero sparire e, magicamente, potrete fare le vostre belle chiamate json esterne.
ciao interessante,
puoi inserire tutto l’html della pagina???
grazie
ciao
giovanni mazze
Ciao Giovanni,
in realtà non ho una pagina html dietro “postabile”, poichè lo script è facente parte di una app HTML5…