- Cosa è un User Agent
- Come rilevo l'User Agent di un dispositivo mobile
- User Agent con javascript
- La funzione preg_match per l'user agent
Esistono diversi metodi per potere rilevare un dispositivo durante la navigazione, tutto dipende da cosa si vuole ricavare con queste informazioni.
Cosa è un User Agent
Ogni volta che il browser di un utente effettua una richiesta al nostro sito, automaticamente invia una intestazione HTTP all'interno della quale, oltre ad altri paramenti quali COOKIE, ACCEPT-LANGUAGE, REFERER, VIEWPORT-WIDTH ed altri viene inviato anche il nostro User Agent con alcune informazioni a seconda del tipo di dispositivo e browser.
Esempio:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, come Gecko) Chrome/91.0.4472.77 Safari/537.36
in questo caso si tratta di un desktop con Windows 10 con altri parametri
Come rilevo l'User Agent di un dispositivo mobile
Per poterlo rilevare è necessario creare un codice che ci consenta di discriminare un browser mobile da quello desktop, per questo esistono diversi script in rete pronti all'uso e di semplice utilizzo.
Ad esempio sul sito detectmobilebrowsers.com sono stati pubblicati degli script nei vari linguaggi, in questo caso prenderemo in esame quello in PHP
echo 'Il tuo User Agent:' .$useragent = $_SERVER['HTTP_USER_AGENT'].'<hr>';
if(
preg_match(
'/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i',$useragent
)
||preg_match(
'/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i',substr($useragent,0,4)
)
)
echo( '<img src="https://serreri.com/assets/img/come-si-rileva-l-user-agent-mobile.jpg">' );
else
echo( '<img src="https://serreri.com/assets/img/come-si-rileva-l-user-agent-desktop.jpg">' );
Come detto esistono diversi modi per rilevare un mobile attraverso l'user agent, questo appena descritto esegue la rilevazione con un codice lato server, ma è anche possibile la rilevazione lato client in ogni caso nulla influisce sulle prestazioni di esecuzione dello script.
User Agent con javascript
Ad esempio da lato client utilizziamo la funzione navigator.userAgent di javasript:
<button onclick="mioUA()">Try it</button>
<p id="demoUA"></p>
<script>
function mioUA() {
var x = "Il tuo User Agent: " + navigator.userAgent;
document.getElementById("demoUA").innerHTML = x;
}
</script>
La funzione preg_match per l'user agent
Altro metodo di rilevamento può essere effettuato attraverso la funzione preg_match() utilizzando una espressione regolare per rilevare un parametro importante presente nella maggior parte dei browser dei dispositivi mobile (ad eccezione per alcuni vecchi modelli come ad esempio con android 4.2.2 Jelly Bean ).
Il parametro in questione è la stringa "mobile", come detto quasi sempre presente in ogni user agent, ad esempio con un telefono Pixel 5 con Android versione 11:
Mozilla/5.0 (Linux; Android 11; Pixel 5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.91 Mobile Safari/537.36
Quindi per rilevare tale parametro è possibile utilizzare il codice:
$useragent = $_SERVER[ 'HTTP_USER_AGENT' ];
if ( preg_match( '/(mobile?|phone?|Symbian|PlayStation)/i', $useragent ) ) {
echo( '<img src="https://serreri.com/assets/img/come-si-rileva-l-user-agent-mobile.jpg">' );
} else {
echo( '<img src="https://serreri.com/assets/img/come-si-rileva-l-user-agent-desktop.jpg">' );
}
In questo esempio abbiamo inserito alcuni parametri come patern riferiti ai modelli con sistema OPV SymbianOS e Symbian o ancora con le console PlayStation
NokiaC5-00/061.005 (SymbianOS/9.3; U; Series60/3.2 Mozilla/5.0; Profile/MIDP-2.1 Configuration/CLDC-1.1) AppleWebKit/525 (KHTML, like Gecko) Version/3.0 Safari/525 3gpp-gba
Mozilla/5.0 (PlayStation; PlayStation 4/8.50) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.0 Safari/605.1.15