In questa guida vedremo in particolare:
Come identificare il tipo di browser di un client
Vediamo un semplice script che ci permette di sapere quale browser sta usando il visitatore del nostro sito.
Per identificare il browser del nostro client dobbiamo eseguire questo script:
// Opera 8.0+
var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
// Firefox 1.0+
var isFirefox = typeof InstallTrigger !== 'undefined';
// Safari 3.0+ "[object HTMLElementConstructor]"
var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && safari.pushNotification));
// Internet Explorer 6-11
var isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
var isChrome = !!window.chrome && !!window.chrome.webstore;
// Blink engine detection
var isBlink = (isChrome || isOpera) && !!window.CSS;
CiaoPotete inserire ed eseguire questo script appena la pagina è caricata. Per esempio se state usando JQuery, potete eseguire questo script nella funzione document.ready()
Questo semplice codice JavaScript funzione nel seguente modo:
- Creiamo una serie di flag che verranno utilizzate per riconoscere il tipo di browser usato dal nostro visitatore
- Possiamo controllare tramite un semplice if .. else … per controllare se il browser usato dal nostro client sia di un certo tipo.
Vediamo un esempio:
Come scoprire se un client sta usando Internet Explorer sul mio sito
Vediamo come controllare se un utente sta facendo uso di IE sul nostro sito:
Dopo aver eseguito lo script principale (mostrato in alto), possiamo eseguire il seguente codice JavaScript per 1- controllare se il client usa internet explorer e 2- eseguire un codice a seconda del browser usato.
// Opera 8.0+
var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
// Firefox 1.0+
var isFirefox = typeof InstallTrigger !== 'undefined';
// Safari 3.0+ "[object HTMLElementConstructor]"
var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && safari.pushNotification));
// Internet Explorer 6-11
var isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
var isChrome = !!window.chrome && !!window.chrome.webstore;
// Blink engine detection
var isBlink = (isChrome || isOpera) && !!window.CSS;
if(isIE){
console.log(“il nostro user ha Internet Explorer”);
} else{
console.log(“il nostro user sta usando un’altro browser”);
}
Potete copiare ed incollare questo codice nel vostro sito e cambiare il flag all’interno del IF a seconda del browser che volete rilevare.
Ci siamo! Ora sapete come riconoscere ed identificare il tipo di browser utilizzato da un visitatore usando JavaScript.
