Oggetto navigator e cross browser scripting
This presentation is the property of its rightful owner.
Sponsored Links
1 / 13

Oggetto Navigator e Cross-Browser Scripting PowerPoint PPT Presentation


  • 96 Views
  • Uploaded on
  • Presentation posted in: General

Oggetto Navigator e Cross-Browser Scripting. Roberto Bruni e Daniela Giorgetti. Script per tutti. Gli script visti sinora vanno bene per (la maggior parte de)i browser più diffusi In seguito vedremo che NN e IE presentano incompatibilità su alcune scelte implementative (es. layers e DHTML)

Download Presentation

Oggetto Navigator e Cross-Browser Scripting

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Oggetto navigator e cross browser scripting

Oggetto Navigator e Cross-Browser Scripting

Roberto Bruni e Daniela Giorgetti


Script per tutti

Script per tutti

  • Gli script visti sinora vanno bene per (la maggior parte de)i browser più diffusi

  • In seguito vedremo che NN e IE presentano incompatibilità su alcune scelte implementative (es. layers e DHTML)

  • Possiamo cercare di limitare le incompatibilità usando JS ed in particolare l’oggetto navigator

Bruni e Giorgetti


Oggetto navigator

Oggetto navigator

  • Rappresenta il browser in uso

  • Permette di ottenere informazioni su nome e versione (e altro)

  • Supportato da N.N. e I.E.

  • Ha due oggetti figli (supportati solo da NN): Plugin e Mimetype

  • Ogni browser può avere proprietà non standard

    • o anche rendere scrivibili proprietà di sola lettura (IE generalmente molto permissivo)

Bruni e Giorgetti


Navigator propriet fondamentali

navigator: proprietà fondamentali

navigator.appCodeName // “Mozilla” per NN2/3/4 e IE3/4

navigator.appName // “Netscape” per NN e “Microsoft Internet Explorer” per IE

navigator.platform // sistema operativo dove gira il browser, es. “Win32”, “MacPPC”

navigator.appVersion //descrizione più completa della piattaforma e del browser

navigator.userAgent //stringa inviata dal browser ai server nelle richieste di pagine web

Bruni e Giorgetti


Eseguire azioni in base al browser

Eseguire azioni in base al browser

if (navigator.userAgent.indexOf(“Mozilla/4”) == -1) {

window.location = “non_Netscape_4_x.html”;

}// Manda a una URL diversa da quella corrente gli utenti che non usano Netscape 4.x

  • Cosa succede se accediamo la pagina con IE5.5?

    navigator.userAgent == “Mozilla/4.0 (compatible; MSIE 5.5…

    • Perché?

      • Patto segreto tra Netscape e Microsoft?

      • Cospirazione Governativa?

      • Netscape si è infiltrato nel campus di Redmond della Microsoft?

    • All’epoca della “guerra dei browser” NN3.0 vs IE3.0 era comune incappare in pagine “NN only” gestite da JS!

      • Soluzione di IE4.0: Mozilla compatible

      • Notare anche la versione 4 invece che 5 (molti script usavano il test visto sopra)

      • Ironicamente vennero incrementate le statistiche di mercato di NN

Bruni e Giorgetti


Netscape pi onesto

Netscape più onesto?

  • Non tanto… con NN6.0?

    navigator.userAgent == “Mozilla/5…

    navigator.appVersion == “5…

    • Perché?

      • Netscape 5.0 versione open source alla base di Netscape 6.

    • Che lezione ne possiamo trarre?

      • cautela, cautela e ancora cautela nel diversificare le pagine

      • provare ad accedere le pagine con più browser possibili

    • Uso pratico: controllare almeno appName e appVersion

      • userAgent meno affidabile perché passato sempre ai server

Bruni e Giorgetti


Soluzione brutale

Soluzione brutale

  • Scegliere una versione di un browser e supportare solo quella cacciando gli “intrusi”

    if (navigator.appName.indexOf(“Netscape”) == -1 ||

    navigator.appVersion.indexOf(“5.0”) == -1) {

    alert(“Scarica Netscape o rinuncia al mio sito!”);

    window.location = “http://www.netscape.com”;

    }

  • Consigli

    • Cercate di essere più gentili (pochi utenti lo saranno con voi)

    • Supportate più browser che potete, magari rinunciando a qualche pulsante elegante o qualche animazione

    • Le pagine web dovrebbero avere più diffusione possibile

Bruni e Giorgetti


Soluzione standard

Soluzione standard

  • Accontentate almeno gli utenti NN5/6 e IE4/5 con pagine ad hoc

  • Usate una pagina di default per tutti gli altri

    if (navigator.appName.indexOf(“Netscape”) > -1 &&

    navigator.appVersion.indexOf(“5”) > -1) {

    window.location = “pagina_netscape5x_6x.html”;

    }

    if (navigator.appName.indexOf(“Microsoft”) > -1 &&

    navigator.appVersion.indexOf(“4”) > -1) {

    window.location = “pagina_iexplorer4x_5x.html”;

    }

    window.location = “pagina_default.html”;

Bruni e Giorgetti


Soluzione raffinata

Soluzione raffinata

  • Fare una sola pagina che accontenti tutti

    • L’idea è di settare opportunamente una variabile e testarla quando si vogliono accedere caratteristiche particolari (usarla come parametro degli script)

    • Si complica molto il codice, ma resta più facile da aggiornare

    • Vedremo esempi di questa soluzione usando DOM e DHTML

      var browser= “OTH”;

      if (parseInt(navigator.appVersion) >= 5 ||

      navigator.appVersion.indexOf(“MSIE 5”) != -1 ||

      navigator.appVersion.indexOf(“MSIE 6”) != -1) {

      browser = “DOM”;

      } else { if (navigator.userAgent.indexOf(“Mozilla/4”) != -1) {

      if (navigator.appName.indexOf(“Netscape”) != -1) {

      browser = “NS4”; }

      if (navigator.appVersion.indexOf(“MSIE 4”) != -1) {

      browser = “IE4”; }

      } }

Bruni e Giorgetti


Navigator linguaggio utente

navigator: linguaggio utente

navigator.language // lingua di default del browser, es. “en”, “it”, “fr”, “fr_CA”, etc. (solo NN4+)

navigator.systemLanguage // lingua di default (solo IE4+)

navigator.userLanguage // lingua dell’utente (solo IE4+)

Bruni e Giorgetti


Pagine multi language

Pagine multi-language

  • Stesse soluzioni viste nel caso dei browser, ma adattate al linguaggio

    • Si può riconoscere prima il browser e poi andare a testare il linguaggio usando le proprietà opportune a seconda che si tratti di NN o di IE

  • Il pericolo è che il linguaggio del browser non sia quello veramente preferito dall’utente

    • Magari sta usando il browser lontano da “casa”

    • Oppure sta utilizzando l’ultimissima versione, non ancora disponibile nella sua lingua

Bruni e Giorgetti


Quiz riassuntivi

Quiz riassuntivi

  • Sapreste suggerire una soluzione salomonica al problema del linguaggio in cui visualizzare la pagina?

  • Cosa NON si può fare con JS?

    • spedire gli utenti Netscape ad un’altra pagina

    • spedire gli utenti Internet Explorer ad un’altra pagina

    • spedire gli utenti che usano browser che non implementano JS ad un’altra pagina

    • spedire gli utenti maleducati a quel… sito (o a fare un giro su web)

  • Come si fa ad aggiornare il browser di un visitatore della pagina?

    • non si può

    • con navigator.browser = “Netscape 6.0”;

    • con window.location = “www.rottamazione.com”;

    • con document.display = “Mozilla 2002”;

Bruni e Giorgetti


Esercizi

Esercizi

Bruni e Giorgetti


  • Login