Considerazioni sul gestore di autenticazioni Web per provider online (HTML)

[ Questo articolo è rivolto agli sviluppatori per Windows 8.x e Windows Phone 8.x che realizzano app di Windows Runtime. Gli sviluppatori che usano Windows 10 possono vedere Documentazione aggiornata ]

In qualità di provider di autenticazione, devi tenere conto di alcuni dettagli per la configurazione del servizio di autenticazione che deve essere usato dalle app di Windows Store. Puoi inoltre personalizzare la pagina Web visualizzata all'utente dell'app di Windows Store con il tuo markup preferito.

Considerazioni per i provider di autenticazione online

Il gestore di autenticazioni Web è basato sulle stesse tecnologie usate per Internet Explorer in Windows. Tuttavia, a causa dello scopo estremamente specifico di questo componente, alcune funzionalità di Internet Explorer sono state disabilitate o vincolate a una configurazione specifica. Il gestore di autenticazione Web fornisce inoltre un canale di registrazione eventi dedicato per semplificare le risoluzione dei problemi con le pagine elaborate.

Modalità documento degli standard di Internet Explorer

Il gestore di autenticazione Web visualizza tutte le pagine nella modalità degli standard di Internet Explorer per la versione specifica di Windows. In Windows 8 ad esempio il gestore di autenticazione Web visualizza le pagine nella "modalità degli standard di Internet Explorer 10". Puoi usare gli strumenti di sviluppo in Internet Explorer per verificare il funzionamento della tua pagina nelle diverse modalità documento. Per altre informazioni sulla compatibilità con Internet Explorer, vedi gli argomenti di MSDN relativi a Internet Explorer.

Funzionalità disabilitate e bloccate

Molte funzionalità of Internet Explorer sono completamente disabilitate o bloccate su valori specifici, che non possono essere modificate nelle opzioni Internet del sistema operativo.

Requisiti per HTTPS

Il primo URL utilizzato da un'applicazione per comunicare con il provider online deve essere di tipo HTTPS.

Dimensione per stati di visualizzazione diversi

Un'app di Windows 8 può essere mostrata in molte visualizzazioni di dimensioni diverse, con orientamento orizzontale o verticale o all'interno di un accesso come l'accesso alla condivisione. La dimensione applicata alle pagine Web può variare a seconda della visualizzazione usata per il gestore di autenticazioni Web. Per altre informazioni, vedi gli argomenti Linee guida per le dimensioni delle finestre e il ridimensionamento in base allo schermo e Linee guida per la condivisione di contenuto.

La pagina Web deve usare le media query CSS (Cascading Style Sheet) per verificare la dimensione da usare e adattare il proprio layout di conseguenza. La pagina non deve essere tuttavia progettata in base al numero esatto di pixel documentato in questo argomento e deve poter scalare a dimensioni diverse. Le dimensioni specificate in questo argomento potrebbero essere modificate nelle versioni future del sistema operativo.

Se lo spazio disponibile non è sufficiente per visualizzare tutte le informazioni della pagina (ad esempio un lungo elenco di autorizzazioni richiesto da un'applicazione), il gestore di autenticazione Web aggiunge le barre di scorrimento per consentire all'utente di scorrere la pagina come necessario. Lo zoom è disponibile sotto forma di zoom con avvicinamento delle dita, per i dispositivi basati sul tocco, e tramite CTRL+rotellina del mouse per i PC desktop e portatili.

Per testare i diversi fattori di scala, puoi usare l'app di esempio del gestore di autenticazioni Web disponibile nell'SDK, caricata in Microsoft Visual Studio Professional 2012, che permette di simulare diverse dimensioni di visualizzazioni.

Visualizzazione di esempio

L'esempio seguente mostra l'interfaccia utente del gestore di autenticazioni Web con le dimensioni seguenti per le pagine Web.

• Larghezza: 260 pixel
• Altezza: altezza dello schermo (dipende dalla risoluzione dello schermo)

Nota che l'interfaccia utente del gestore di autenticazioni Web è solo sul lato destro della schermata.

Visualizzazione in un accesso

Le dimensioni della pagina Web per la visualizzazione in un accesso sono:

• Larghezza: 566 pixel
• Altezza: altezza dello schermo (dipende dalla risoluzione dello schermo)

L'esempio seguente mostra l'interfaccia utente del gestore di autenticazione Web per la visualizzazione in un accesso.

Visualizzazione di selezione file

Le dimensioni della pagina Web per la visualizzazione di selezione file sono:

• Larghezza: 566 pixel
• Altezza: altezza dello schermo (dipende dalla risoluzione dello schermo)

L'esempio seguente mostra l'interfaccia utente del gestore di autenticazione Web per la visualizzazione di selezione file.

Assenza di nuove finestre per impostazione predefinita

Per impostazione predefinita, nessun URL determina l'apertura di una nuova finestra, ma viene visualizzato nella finestra del gestore di autenticazione Web. Sono incluse le pagine che utilizzano il metodo JavaScript window.open, l'attributo "target" dei collegamenti ipertestuali o il meccanismo CTRL+clic utilizzato dall'utente per forzare l'apertura di una nuova finestra. Si verifica un'eccezione a questa regola quando una pagina Web dichiara un collegamento come sicuro per l'esplorazione nel browser, come spiegato nell'argomento Personalizzazione della destinazione dei collegamenti ipertestuali.

Personalizzazione delle pagine di autenticazione Web

Una pagina Web consente di personalizzare l'interfaccia utente modificando i colori di titoli, icone e intestazione, tramite i tag META definiti nella pagina Web. Gli sviluppatori Web possono utilizzare tag HTML <meta> per mostrare la personalità e il marchio del provider nell'interfaccia utente del gestore di autenticazione Web. Gli sviluppatori possono inoltre pilotare anche le azioni utente più complesse, come l'iscrizione e il recupero delle password. Il concetto è molto simile alla funzionalità Siti aggiunti di Windows Internet Explorer 9 e Windows 7.

Oltre a consentire la personalizzazione dell'interfaccia utente nella propria area, la pagina Web può anche sfruttare gli stili dei controlli di Windows 8, essere abilitata per il tocco e consentire l'apertura di collegamenti nel browser al momento opportuno.

Di seguito puoi vedere un esempio di pagina Web che sfrutta il modello di personalizzazione del gestore di autenticazione Web.

Personalizzazione dell'icona

La pagina Web può fornire un'icona tramite un metatag mswebdialog-logo

<meta name="mswebdialog-title" content="Contoso Social"/>

Il contenuto è un URL, che può essere relativo alla pagina o assoluto. Lo schema dell'URL può essere HTTP o HTTPS. Il formato del file deve essere PNG o JPG e l'immagine deve avere dimensioni di 30x30 pixel. Se le dimensioni dell'immagine sono diverse, il sistema operativo provvederà ad aumentarle o ridurle per adattarle all'area di 30x30 pixel. L'immagine deve essere progettata per supportare correttamente il rendering con ingrandimento fino al 140% e al 180%, per essere utilizzabile anche su schermi con risoluzione superiore. Per testare i diversi fattori di scala, puoi usare l'app di esempio del gestore di autenticazione Web disponibile nell'SDK, caricata in Visual Studio 11, che permette di simulare vari fattori di scala e risoluzioni tramite la finestra Dispositivo della modalità di progettazione.

Personalizzare il testo del titolo

La pagina Web può fornire il titolo tramite il metatag mswebdialog-title.

<meta name="mswebdialog-title" content="Contoso Social"/>

Il titolo deve essere breve e contenere il marchio del provider, ad esempio Contoso.

Personalizzare il colore dell'intestazione

La pagina Web può fornire il colore che rappresenta l'identità del marchio, da utilizzare per l'intestazione della finestra di dialogo, tramite il metatag mswebdialog-header-color.

<meta name="mswebdialog-header-color" content="#1267DF"/>

Il colore può essere uno qualsiasi dei valori specificati qui. Il gestore di autenticazione Web ignora tuttavia qualsiasi valore di canale alfa. Per questo colore in particolare e per i colori utilizzati nella pagina in generale, è consigliabile adottare la stessa combinazione di colori utilizzata nell'app del provider per Windows 8, se disponibile.

Nota  Dopo l'analisi dei metatag, le icone e i colori vengono memorizzati nella cache del client a livello di server. Affinché le modifiche abbiano effetto, devi cancellare la cache del client prima di avviare l'interfaccia utente. A tale scopo, è necessario modificare le seguenti impostazioni del Registro di sistema.

// Registry location under HKLM used for setting various AuthHost parameters.
#define AUTH_HOST_LOCAL_MACHINE_REGPATH \
    L"SOFTWARE\\Microsoft\\Windows NT\\CurrentVersion\\Image File Execution Options\\authhost.exe"
// MaxAge to use for downloading logo images
#define AUTH_HOST_LOGO_IMAGE_MAX_AGE_SECONDS_REG_VALUE_NAME \
    L"LogoImageMaxAgeSeconds"
// 24 hours
#define AUTH_HOST_LOGO_IMAGE_MAX_AGE_SECONDS_DEFAULT        \
    (24 * 60 * 60)

Dopo il download l'icona non viene più recuperata per 24 ore. Per testare le immagini del logo, devi impostare la chiave di registro precedente su un valore inferiore.

Personalizzare la pagina Web

Oltre a personalizzare l'interfaccia utente nell'area della pagina Web, gli sviluppatori possono anche creare pagine Web che si integrano completamente con l'esperienza globale di Windows 8. Questo include l'uso degli stili consigliati, la verifica del funzionamento ottimale delle pagine Web con i dispositivi abilitati per il tocco e l'apertura di determinate pagine Web nel Web browser.

• Applicazione di stili

  Ti invitiamo a utilizzare gli stili consigliati qui per creare un'esperienza utente più coerente tra le pagine Web del gestore di autenticazione Web e gli altri componenti dell'interfaccia utente di Windows 8. La pagina Web deve avere uno sfondo bianco ed essere priva di bordi. I pulsanti, come Accedi o Annulla, devono trovarsi nell'angolo inferiore destro e utilizzare lo stesso colore dell'intestazione. Infine, poiché il gestore di autenticazione Web fornisce un pulsante Indietro, considera la possibilità di eliminare completamente il pulsante Annulla dalla pagina Web.

• Abilitazione del tocco

  La pagina Web deve essere progettata pensando a un'interazione con l'utente basata sul tocco. Per ulteriori informazioni sulla progettazione per l'interazione basata sul tocco in Windows 8, vedi l'argomento Progettazione delle interazioni tramite tocco.

• Personalizzazione della destinazione dei collegamenti ipertestuali

  Il gestore di autenticazione Web costituisce la soluzione ottimale per fornire pagine Web che richiedono una singola azione dell'utente, come le pagine di accesso o di autorizzazione OAuth. Tuttavia per flussi utente più complicati, come la creazione degli account, il recupero di una password persa o dimenticata, la visualizzazione dell'informativa sulla privacy e così via, in cui è previsto che l'utente dedichi un po' di tempo alla comprensione e al completamento del flusso, è consigliabile aprire le pagine nel browser preferito dall'utente, per supportare la navigazione completa e l'esplorazione avanzata. Per impostazione predefinita, il gestore di autenticazione Web non consente l'apertura di nuove finestre del browser da una pagina Web (per ulteriori informazioni, vedi la sezione dedicata all'assenza di nuove finestre per impostazione predefinita). Tuttavia, tramite il metatag mswebdialog-newwindowurl la pagina Web può dichiarare gli URL da aprire nel browser.

  Il metatag mswebdialog-newwindowurl permette a una pagina Web di specificare un URL, o parte dell'URL che verrà utilizzato dal gestore di autenticazione Web, per eseguire un confronto (confronto della stringa a sinistra) ogni volta che viene richiesta l'apertura di un URL in una nuova finestra, tramite l'attributo target o il metodo window.open(). In caso di corrispondenza, l'URL viene aperto nel browser predefinito dell'utente. Se l'URL non corrisponde, il gestore di autenticazione Web vi accede direttamente (comportamento predefinito). Ad esempio:<meta name="mswebdialog-newwindowurl" content="https://www.contoso.com/privacy"/>

  Nel caso di questo metatag, il gestore di autenticazione Web apre l'URL https://www.contoso.com/privacy/policy.html nel browser, ma accede direttamente all'URL https://www.contoso.com/termsofuse.html. Ricorda che questo metatag non influisce sui collegamenti che non tentano di aprire una nuova finestra, ad esempio quelli che non utilizzano l'attributo target o il metodo window.open(). Il contenuto è un URL, che può essere relativo alla pagina o assoluto. Lo schema dell'URL può essere HTTP o HTTPS. Devi definire i metatag mswebdialog-newwindowurl necessari per coprire tutti i collegamenti che non fanno parte del flusso base dell'utente, come informative sulla privacy, moduli di iscrizione e così via. Se la tua app supporta l'accesso con un provider di autenticazione di terze parti (ad esempio provider OpenID), assicurati che tali interazioni avvengano nell'ambito del gestore di autenticazione Web. Affinché tutti i collegamenti della tua pagina possano essere aperti in modo sicuro nel browser, devi usare la sintassi con asterischi, ad esempio, <meta name="mswebdialog-newwindowurl" content="*"/> Ricorda che l'asterisco (*) può essere utilizzato solo in modo esclusivo e non può essere combinato con un altro URL. Ad esempio, la sintassi "https://www.contoso.com/*" non è valida.

Regole valide per tutti i metatag

Quando il gestore di autenticazione Web elabora i metatag, vengono applicate le regole seguenti:

• L'effetto del metatag persiste per tutte le pagine nello stesso dominio di secondo livello (ad esempio, contoso.com), a meno che non venga riscontrato un metatag con lo stesso nome ma contenuto diverso.
• Se nella stessa pagina vengono rilevati più metatag con lo stesso nome, il gestore di autenticazione Web ne sceglie uno e ignora gli altri. Non è possibile conoscere in anticipo il metatag specifico che verrà scelto. Nota  Questa regola non vale per il metatag mswebdialog-newwindowurl, che supporta la presenza di più istanze nella stessa pagina.  

Argomenti correlati

Gestore di autenticazioni Web

Esempio di gestore di autenticazioni Web

Windows.Security.Authentication.Web