php: riconoscere il dispositivo del client
TRANSCRIPT
Stefano Floris, Versione gennaio 2016
Realizzare programmi gestionali in ambiente Android con HTML e PHP, Ajax, Json
Pubblicato su www.troppocurioso.altervista.org
La navigazione in internet da parte degli utenti avviene, per semplificare, utilizzando tre
categorie di dispositivi: computer, tablet e smartphone.
Le dimensioni dello schermo e la presenza del touchscreen comportano una notevole
differenza d'uso.
PHP, riconoscere i dispositivi mobili Smartphone e Tablet
Per vedere una copia del testo della licenza visita il sito http://www.creativecommons.it/Licenze
Stefano Floris, 2015www.troppocurioso.altervista.org
Questa opera è sotto licenza creativa (di tipo copyleft)
Attribuzione-Non commerciale-Condividi allo stesso modo Generico.
Le applicazioni realizzate con HTML e PHP viste fin qui erano pensate per
girare su pc, dotato di un monitormonitor. La progettazione della loro
interfaccia era come illustrato nella pagina seguente.
PHP, per dispositivi mobili Smartphone e Tablet
dd
E' la “vecchia” gestione che abbiamo studiato nel capitolo 4: una pagina html che chiama una pagina php che interroga il db,
prende il recordset e lo visualizza.
PHP, per dispositivi mobili Smartphone e Tablet
Ma un utente che usa un dispositivo mobile ha uno schermo
piu' piccolo.E allora, il sito web progettato per essere visto e usato
su un monitor di un pc va bene anche per un dispositivo mobile?
La risposta è no!
PHP, per dispositivi mobili Smartphone e Tablet
Un sito WEB realizzato per essere fruito da un pc deve
essere TOTALMENTE
ripensato se deve poter essere visitato
anche da uno smartphone.
PHP, per dispositivi mobili Smartphone e Tablet
Gli attuali strumenti per realizzare
applicazioni web multi-piattaforma
consentono di progettare una unico
programma che si adatta al dispositivo
dal quale viene utitilizzato.
Ecco cosa cambia. La prima pagina, quella html conterrà anche il codice js
per gestire il risultato. Sarà la CPU del client a
preoccuparsi di visualizzare i dati.
Come vedete la seconda pagina è quasi vuota. Il codice Php sarà ridotto: svolgerà solo l'interrogazione al db ma non gestirà
piu' la parte di visualizzazione dei risultati. La gestione dell'interfaccia non è piu'
appannaggio del php ma del javascript sul client.
Il server lavorerà solo sull'interrogazione al db.
Manderà il risultato al client.
PHP, Ajax-Json e MYSQL
dd
E' la “vecchia” gestione che abbiamo studiato nel capitolo 4: una pagina html che chiama una pagina php che interroga il db,
prende il recordset e lo visualizza.
PHP, per dispositivi mobili Smartphone e Tablet
Ci sono casi però in cui non è possibile realizzare una unica applicazione
che (grazie al css, al javascript e all'ajax) si adatta al dispositivo e
cambia il suo aspetto (e le sue funzioni).
Lo so. Qualche programmatore purista storgerà il naso rispetto a quello che sto per dirvi. Ma penso sia giusto affrontare il caso in cui si decida di scrivere pagine diverse dell'applicazione: alcune dedicate alla navigazione da pc altre da dispositivo
mobile.
Quando si sceglie questa strada per un progetto informatico si disegnano pagine diverse per le medesime funzioni. Nel
progetto potrebbero esserci alcuni doppioni: pagine con la stessa funzione ma disegnate
in maniera diversa. Mi spiego con un esempio.
PHP, per dispositivi mobili Smartphone e Tablet
Qui a fianco un esempio di pagina
web dove si richiedono diverse
informazioni. Potete osservare svariati campi di
input.
PHP, per dispositivi mobili Smartphone e Tablet
Se la pagina è visitata tramite
uno smartphone, non sarà visibile
interamente.
PHP, per dispositivi mobili Smartphone e Tablet
L'utente dovrà scorrere con il dito
la maschera per cercare i campi dove inserire i
dati.
PHP, per dispositivi mobili Smartphone e Tablet
Non è necessariamente negativo non vedere tutti
i dati nella stessa schermata.
E' UNA SCELTA.
E' il progettista che deve decidere quale aspetto
devono avere le maschere di input in ciascun dispositivo.
PHP, per dispositivi mobili Smartphone e Tablet
In questa lezione impareremo a creare
pagine web dello stesso applicativo diversificate
per ciascun tipo di dispositivo.
PHP, per dispositivi mobili Smartphone e Tablet
Si tratta di una soluzione tecnica poco diffusa, ma molto utile
dal punto di vista didattico per imparare a
gestire questo tipo di problema.
Qui accanto potete notare che la pagina
web che appare nello
schermo dello
smartphone è stata
ridisegnata.
PHP, per dispositivi mobili Smartphone e Tablet
La pagina grande è
stata suddivisa in piu' pagine.
PHP, per dispositivi mobili Smartphone e Tablet
Se la pagina web originale si chiamava
inserimento.php, quelle realizzate per
lo smartphone potrebbero essere
ins1_mob.php, ins2_mob.php, ins3_mob.php, ins4_mob.php, ins5_mob.php.
PHP, per dispositivi mobili Smartphone e Tablet
La pagina inserimento.php non viene cancellata. Il
nostro progetto prevederà la presenza sia di questa pagina
che delle altre cinque.
PHP, per dispositivi mobili Smartphone e Tablet
Rimane da capire come far si che
all'utente appaia o la prima pagina oppure in sequenza le altre
cinque (con un input dei dati in piu' parti)
se accede tramite smartphone.
PHP, per dispositivi mobili Smartphone e Tablet
L'utente del dispositivo mobile,
dovrà fare piu' passaggi per inserire
le informazioni.
PHP, per dispositivi mobili Smartphone e Tablet
L'utente del dispositivo mobile,
dovrà fare piu' passaggi per inserire
le informazioni.
PHP, per dispositivi mobili Smartphone e Tablet
Se la pagina web originale si chiamava
inserimento.php, quelle realizzate per
lo smartphone potrebbero essere
ins1_mob.php, ins2_mob.php, ins3_mob.php, ins4_mob.php, ins5_mob.php.
PHP, per dispositivi mobili Smartphone e Tablet
Per risolvere questo problema useremo una variabile globale di
PHP: $_SERVER.
$_SERVER è un array, un vettore. In particolare è un vettore associativo. Per semplificare, le posizioni
degli elementi del vettore associativo non si raggiungono tramite un indice numerico ma tramite
il nome del dato.
PHP, per dispositivi mobili Smartphone e Tablet
PHP, per dispositivi mobili Smartphone e Tablet
Quando spiego i vettori uso l'esempio dei grattacieli con i
piani (gli elementi) e dell'ascensore (l'indice).
PHP, per dispositivi mobili Smartphone e Tablet
Se $_SERVER fosse un vettore normale si userebbe così: echo $_SERVER[5]. In questo modo avrei in output
il contenuto della posizione 5 del vettore $_SERVER
5° - Medici----->4° - Bruno------>3° - Vespucci-->2° - Alighieri-->1° - Buonarroti>
PHP, per dispositivi mobili Smartphone e Tablet
Siccome $_SERVER è un vettore associativo si usa
così: echo $_SERVER[“SERVER_ADDR”]. Al posto dell'indice ho
il nome del dato che desidero mandare in output.
5° - Medici----->4° - Bruno------>3° - Vespucci-->2° - Alighieri-->1° - Buonarroti>
PHP, per dispositivi mobili Smartphone e Tablet
Per i vettori associativi dico che è come se l'ascensore
avesse, invece che i pulsanti con i numeri, i nomi di chi
abita al piano.
5° - Medici----->4° - Bruno------>3° - Vespucci-->2° - Alighieri-->1° - Buonarroti>
PHP, per dispositivi mobili Smartphone e Tablet
L'elenco dei nomi si trova, ad esempio, nel manuale
ufficiale di PHP: http://php.net/manual/en/rese
rved.variables.server.php.
5° - Medici----->4° - Bruno------>3° - Vespucci-->2° - Alighieri-->1° - Buonarroti>
PHP, per dispositivi mobili Smartphone e Tablet
Alcune posizioni sono: “SERVER_ADDR” che contiene l'indirizzo IP del pc client, oppure
“HTTP_USER_AGENT” che contiene le informazioni del
software che sta accedendo alla pagina (Internet
Explore/Mozilla/Chrome ecc.).
5° - Medici----->4° - Bruno------>3° - Vespucci-->2° - Alighieri-->1° - Buonarroti>
Vediamo quindi quali
sono i contenuti del
vettore $_SERVER che servono
a noiLa posizione $_SERVER[“SERVER_ADDR”] contiene i
dati dell'agent, cioè del client che sta accedendo alla pagina. Ecco un esempio di per generare un output usando $_SERVER.
PHP, per dispositivi mobili Smartphone e Tablet
<HTML><HEAD><TITLE> Uso della variabile globale di sistema $_SERVER</TITLE></HEAD>
<BODY>
Esempio di uso di $SERVER
<?PHPEcho "SERVER_ADDR: ". $_SERVER['SERVER_ADDR']."<br>";Echo "HTTP_USER_AGENT: ". $_SERVER['HTTP_USER_AGENT']."<br>";Echo "SERVER_NAME: ". $_SERVER['SERVER_NAME']."<BR>";
?></BODY>
</HTML>
Un semplice programma PHP per visualizzare alcuni dati che il server riceve dal
client. Se provate a collegarvi alla pagina usando
browser diversi o computer diversi avrete risposte
diverse.
PHP, per dispositivi mobili Smartphone e Tablet
E' quindi la posizione 'HTTP_USER_AGENT' che a noi interessa. Ci permette di capire da
quale dispositivo l'utente si sta collegando. Dal sistema operativo
possiamo dedurlo.
PHP, per dispositivi mobili Smartphone e Tablet
Se provate ad accedere alla pagina per tramite di un tablet o di uno
smartphone vedrete i cambiamenti dell'output.
PHP, per dispositivi mobili Smartphone e Tablet
$user_agent=$_SERVER['HTTP_USER_AGENT'];$host=$_SERVER['HTTP_HOST'];
// Controllo del dispositivo//$iphone=strpos($_SERVER['HTTP_USER_AGENT'],"iPhone");$android=strpos($_SERVER['HTTP_USER_AGENT'],"Android");$palmpre=strpos($_SERVER['HTTP_USER_AGENT'],"webOS");$berry=strpos($_SERVER['HTTP_USER_AGENT'],"BlackBerry");$ipod=strpos($_SERVER['HTTP_USER_AGENT'],"iPod");$ipad=strpos($_SERVER['HTTP_USER_AGENT'],"iPad");
// Se una delle variabili contiene VERO// significa che il client naviga da disp. mobile// // Ridireziono alla pagina //if (($iphone==true)||($android==true)||($palmpre==true)||
($berry==true)||($ipod==true)||($ipad==true)) {header('Location: Controllo_dispositivo_mobile.php?browser='.
$browser.'&host='.$host);} else {
header('Location: Controllo_dispositivo_web.php?browser='.$browser.'&host='.$host);
}?>// Preso spunto dal lavoro di Alessandro Ristori
Questo invece è un programma che,
individuato il dispositivo dal quale naviga il
client, ridireziona ad una pagina
specifica.Guardate il
funzionamento della funzione HEADER().
PHP, per dispositivi mobili Smartphone e Tablet
Abbiamo terminato.Il prossimo passo è la realizzazione di APP
con accesso a DB.
Seguiteci su www.altervista.troppocuriso.org
PHP, per dispositivi mobili Smartphone e Tablet