Debuggure applicazioni mobile fatte con PhoneGap su Desktop

PhoneGap è un framework molto valido per lo sviluppo di applicazioni mobile utilizzando HTML, CSS e Javascript (non mi azzardo ad affermare che sia il migliore perché ne esistono altri che non ho provato e quindi non potrei dare giudizi attendibili). Se siete degli sviluppatori web e avete bisogno di realizzare semplici applicazioni per dispositivi mobili PhoneGap è la manna dal cielo, anche perché potrete agevolmente portare la vostra applicazione sui principali sistemi operativi mobile: da iOS ad Android passando per Windows Mobile, Blackberry, Bada e WebOS tanto per fare qualche nome. Se ci aggiungete che è stato preso sotto l’egida delle Adobe che tramite il servizio Adobe PhoneGap Build vi permetterà di effettuare la compilazione delle applicazioni tramite un servizio cloud che vi eviterà di dover possedere per esempio un Mac per poter realizzare la vostra applicazione per iOS.

Build-Diagram-2

Una cosa molto comoda nell’utilizzo di PhoneGap consiste senza dubbio nel poter debuggure l’applicazione usando un comunissimo browser come banco di prova, anche se il problema è dietro l’angolo. Ormai tutti i browser moderni, per motivi di sicurezza, non permettono di effettuare richieste AJAX cross-domain e quindi tutte le volte che dovrete andare a recuperare dei dati per esempio tramite API Rest (cosa molto comune oggigiorno anche per comunicare con i principali social network), incorrerete nel fatidico errore Origin null is not allowed by Access-Control-Allow-Origin.

La soluzione a questo problema è disattivare i controlli di sicurezza del vostro browser circa le richieste AJAX effettuate in modo da poter chiamare API attive e pubbliche e quindi presenti su domini diversi da quello su cui la vostra applicazione sta attualmente girando, ovvero localhost o file://.

Se usate Firefox tutto questo è possibile tramite una comodissima estensione Force CORS che una volta installata vi permetterà di aggiungere agli header delle richieste HTTP la direttiva Access-Control per effettuare Cross Origin Resource Sharing (CORS).

Se invece vi affidate a Google Chrome non è necessario installare nessun componente aggiuntivo ma basterà avviare il programma con le opzioni

-–allow-file-access-from-files  --disable-web-security

che per gli utenti Mac si traduce nell’avviare Chrome da Terminale con il comando:

open -a Google\ Chrome --args -–allow-file-access-from-files --disable-web-security

per utenti Windows con il comando da command-line:

chrome.exe -–allow-file-access-from-files --disable-web-security

e per quelli Linux eseguendo da linea di comando:

google-chrome -–allow-file-access-from-files --disable-web-security

Sicuramente sarà possibile avviare anche gli altri browser nella medesima modalità, ma utilizzando (e vedendo utilizzare dai colleghi) prevalentemente questi due, lascio a voi il compito di scoprire come con il browser che utilizzate solitamente per lo sviluppo delle interfacce grafiche delle vostre applicazioni web.

E’ scontato ricordarvi che quando il browser è avviato in questa modalità non siete coperti da eventuali attacchi di tipo XSRF (Cross Site Request Forgery, anche conosciuti come CSRF), quindi vi consiglio vivamente di non avventurarvi nella normale navigazione del web a meno che non siate estremamente sicuri dei siti che andrete a visitare.

Rispondi