Considérations relatives au service Broker d’authentification web pour les fournisseurs en ligne (HTML)

[ Cet article est destiné aux développeurs de Windows 8.x et Windows Phone 8.x qui créent des applications Windows Runtime. Si vous développez une application pour Windows 10, voir la Documentation ]

En tant que fournisseur d’authentification, vous devez tenir compte de certains détails lorsque vous configurez le service d’authentification qui sera utilisé par les applications du Windows Store. Notez également que vous pouvez personnaliser la page Web qui sera présentée à l’utilisateur de l’application du Windows Store avec le balisage de votre choix.

Considérations pour les fournisseurs d’authentification en ligne

La conception du service Broker d’authentification Web s’appuie sur les mêmes technologies que celles qui permettent le fonctionnement d’Internet Explorer dans Windows. Toutefois, en raison d’une fonctionnalité très spécifique de ce composant, certaines fonctionnalités d’Internet Explorer ont été désactivées ou verrouillées dans une configuration spécifique. En outre, le service Broker d’authentification Web fournit un canal de journalisation d’événements dédié permettant de résoudre des problèmes liés aux pages qu’il traite.

Mode de document standard d’Internet Explorer

Le service Broker d’authentification Web affiche toutes les pages en mode standard d’Internet Explorer pour la version spécifique de Windows. Par exemple, dans Windows 8, le service Broker d’authentification Web affiche les pages en "mode Normes IE10". Vous pouvez utiliser les outils de développement d’Internet Explorer pour voir comment votre page fonctionne dans différents modes de document. Pour plus d’informations sur la compatibilité d’Internet Explorer, voir les rubriques MSDN relatives à Internet Explorer.

Fonctionnalités désactivées et verrouillées

Plusieurs fonctionnalités d’Internet Explorer sont soit complètement désactivées soit bloquées sur des valeurs spécifiques qui ne peuvent pas être modifiées dans les Options Internet du système d’exploitation.

Spécification HTTPS

La première URL utilisée par une application pour communiquer avec le fournisseur en ligne doit être une URL HTTPS.

Dimension de différents états d’affichage

Une application Windows 8 peut apparaître dans des applications de tailles différentes, en mode Portrait ou Paysage, ou encore dans une icône telle que l’icône Partager. En fonction de l’affichage dans lequel le service Broker d’authentification Web apparaît, la taille avec laquelle les pages Web doivent fonctionner peut varier. Pour plus d’informations, voir les rubriques Recommandations en matière de tailles de fenêtre et de mise à l’échelle à la taille des écrans et Recommandations en matière de partage de contenu.

La page Web doit utiliser des requêtes de média CSS pour vérifier la taille avec laquelle elle doit fonctionner et adapter sa disposition en conséquence. Toutefois, la page ne doit pas être conçue en fonction du nombre exact de pixels documenté ici et doit pouvoir s’adapter à différentes tailles. Les tailles spécifiées dans le présent document peuvent faire l’objet de modification dans les futures versions du système d’exploitation.

Si une page ne peut pas contenir toutes les informations dans un espace alloué (par exemple, une longue liste d’autorisations demandées par une application), le service Broker d’authentification Web fournit des barres de défilement pour permettre à l’utilisateur de faire défiler la page, si nécessaire. La fonctionnalité de zoom est également fournie sous la forme d’un zoom par pincement pour les appareils tactiles et de Ctrl + la roulette de la souris pour les ordinateurs portables et de bureau.

Pour tester différents facteurs d’échelle, utilisez l’exemple d’application du Kit de développement logiciel (SDK) du service Broker d’authentification Web chargé dans Microsoft Visual Studio Professionnel 2012, lequel permet de simuler différentes tailles d’affichage.

Affichage de l’exemple

L’exemple suivant présente l’interface utilisateur du service Broker d’authentification Web avec les dimensions de page Web suivantes :

• Largeur : 260 pixels
• Hauteur : hauteur de l’écran (dépend de la résolution de l’écran)

Notez que l’interface utilisateur du service Broker d’authentification Web se trouve uniquement sur le côté droit de la capture d’écran.

Affichage d’icône

Pour l’affichage d’icône, les dimensions de la page Web sont les suivantes :

• Largeur : 566 pixels
• Hauteur : hauteur de l’écran (dépend de la résolution de l’écran)

L’exemple suivant présente l’interface utilisateur du service Broker d’authentification Web dans l’affichage d’icône.

Affichage de sélecteur de fichiers

Pour l’affichage de sélecteur de fichiers, les dimensions de la page Web sont les suivantes :

• Largeur : 566 pixels
• Hauteur : hauteur de l’écran (dépend de la résolution de l’écran)

L’exemple suivant présente l’interface utilisateur du service Broker d’authentification Web dans l’affichage de sélecteur de fichiers.

Par défaut, pas nouvelle fenêtre

Par défaut, une URL n’entraîne jamais l’ouverture d’une nouvelle fenêtre, mais au lieu de cela, s’affiche dans la fenêtre du service Broker d’authentification Web. Cela inclut la méthode JavaScript window.open, l’attribut "target" des liens hypertexte ou l’utilisation du mécanisme Ctrl+clic par l’utilisateur pour forcer l’ouverture d’une nouvelle fenêtre. Cette règle a une l’exception : lorsqu’une page Web déclare un lien comme étant digne de confiance pour faire l’objet d’un accès dans un navigateur, comme décrit dans la section « Personnalisation de la cible des liens hypertexte ».

Personnalisation de pages d’authentification Web

Une page Web personnalise l’interface utilisateur avec le titre, l’icône et la couleur d’en-tête, à l’aide de balises METADATA définies sur cette page. Les développeurs Web peuvent utiliser des balises <meta> HTML pour afficher la personnalité et la marque du fournisseur dans l’interface utilisateur du service Broker d’authentification Web. De plus, ils peuvent appliquer des actions utilisateur plus élaborées, par exemple la connexion et la récupération de mots de passe. Le concept est très semblable à la fonctionnalité Sites épinglés de Windows Internet Explorer 9 et de Windows 7.

Outre la personnalisation de l’interface utilisateur autour de la zone de page, la page Web doit également tirer parti des styles des contrôles Windows 8, prendre en charge les fonctionnalités tactiles et permettre l’ouverture de liens dans le navigateur, le cas échéant.

Voici un exemple de page Web qui a tiré parti du modèle de personnalisation du service Broker d’authentification Web.

Personnalisation de l’icône

La page Web peut fournir une icône à l’aide d’une balise META mswebdialog-logo.

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

Le contenu est une URL qui peut être une page relative ou absolue. Le schéma de l’URL peut être HTTP ou HTTPS. Le format du fichier doit être PNG ou JPG. La taille de l’image doit être de 30 x 30 pixels. Si l’image est d’une autre taille, elle est réduite ou agrandie par le système d’exploitation pour occuper un espace de 30 x 30. L’image doit être conçue pour s’afficher correctement lorsqu’elle est agrandie jusqu’à 140 % et 180 % afin prendre en compte les écrans de résolution plus élevée. Pour tester différents facteurs d’échelle, utilisez l’exemple d’application du Kit de développement logiciel (SDK) du service Broker d’authentification Web chargé dans Visual Studio 11, lequel permet de simuler différentes résolutions et différents facteurs d’échelle à l’aide des fenêtres Périphérique du mode Design.

Personnaliser le texte du titre

La page Web peut fournir le titre à l’aide d’une balise META mswebdialog-title.

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

Le titre doit être court et refléter la marque du fournisseur (par exemple, Contoso).

Personnaliser la couleur d’en-tête

La page Web peut utiliser une balise META mswebdialog-header-color pour fournir la couleur représentant l’identité de sa marque à utiliser pour l’en-tête de la boîte de dialogue.

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

Cette couleur peut être n’importe quelle valeur spécifiée ici. Toutefois, le service Broker d’authentification Web ignore toute valeur de canal alpha. Avec cette couleur en particulier et avec les couleurs utilisées sur la page en général, il est recommandé de suivre les mêmes couleurs que celles utilisées dans l’application Windows 8 du fournisseur, le cas échéant.

Remarque  Les icônes et les couleurs sont mises en cache par serveur sur le client une fois les balises META analysées. Videz le cache client avant de lancer l’interface utilisateur, afin que les modifications apportées prennent effet. Pour ce faire, modifiez les paramètres de Registre suivants.

// 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)

Une fois qu’une icône est téléchargée, elle n’est plus à nouveau sélectionnée pendant 24 heures. Afin de tester des images de logo, affectez une valeur plus faible à la clé de Registre ci-dessus.

Personnaliser la page Web

Outre la personnalisation de l’interface utilisateur autour de la page Web, les développeurs doivent également créer des pages Web transparentes et intégrées à l’expérience globale de Windows 8. Cela inclut l’utilisation de styles recommandés, ce qui garantit un fonctionnement optimal des pages Web avec les périphériques pendant en charge les fonctionnalités tactiles et l’ouverture de certaines pages Web dans le navigateur Web.

• Application de styles

  Il est fortement recommandé d’utiliser l’application de styles conseillée ici pour créer une expérience utilisateur plus cohérente dans les pages Web du service Broker d’authentification Web et d’autres composants d’interface utilisateur de Windows 8. La page Web doit utiliser un arrière-plan blanc et aucun bord. Les boutons tels que Se connecter (Login) et Annuler (Cancel) doivent être placés dans l’angle inférieur droit et utiliser la même couleur que l’en-tête. Enfin, étant donné que le service Broker d’authentification Web fournit un bouton Précédent (Back), pensez à supprimer complètement un bouton Annuler (Cancel) de la page Web.

• Activation des fonctionnalités tactiles

  La page Web doit être conçue en ayant à l’esprit l’interaction tactile de l’utilisateur. Pour plus d’informations sur la conception de l’interaction tactile dans Windows 8, voir la rubrique Conception de l’interaction tactile.

• Personnalisation de la cible des liens hypertexte

  Le service Broker d’authentification Web est idéal pour fournir des pages Web ne nécessitant qu’une seule action de l’utilisateur, telles que les pages de connexion ou d’autorisation OAuth. Toutefois, pour les flux d’utilisateurs plus complexes tels que la création de compte, la récupération d’un mot de passe perdu ou oublié, l’affichage de déclarations de confidentialité, etc., dans lesquels l’utilisateur est sensé consacrer du temps à la compréhension et à l’achèvement du flux, il est préférable que ces pages soient lancées dans le navigateur préféré de l’utilisateur pour prendre en charge la navigation complète et accéder aux sites recherchés. Par défaut, le service Broker d’authentification Web n’autorise pas l’ouverture de nouvelles fenêtres de navigateur à partir d’une page Web. (Pour plus d’informations, voir la section « Par défaut, pas de nouvelle fenêtre »). Toutefois, en utilisant la balise META mswebdialog-newwindowurl, la page Web peut déclarer les URL qui doivent s’ouvrir dans le navigateur.

  La balise mswebdialog-newwindowurl permet à la page Web de spécifier une URL ou une partie de l’URL que le service Broker d’authentification Web utilisera pour effectuer une mise en correspondance (correspondance de la chaîne de gauche) chaque fois qu’il lui est demandé d’ouvrir une URL dans une nouvelle fenêtre à l’aide de l’attribut cible ou de la méthode window.open(). S’il existe une correspondance, l’URL s’ouvre dans le navigateur par défaut de l’utilisateur. S’il n’existe pas de correspondance, le service Broker d’authentification Web accède à l’URL elle-même (comportement par défaut). Par exemple :<meta name="mswebdialog-newwindowurl" content="https://www.contoso.com/privacy"/>

  Dans le cas de cette balise META, le service Broker d’authentification Web ouvre l’URL https://www.contoso.com/privacy/policy.html dans le navigateur, mais accède directement à https://www.contoso.com/termsofuse.html. Notez que les liens qui ne tentent pas de s’ouvrir dans une nouvelle fenêtre (par exemple, les liens qui n’utilisent pas d’attribut cible ou la méthode window.open()) ne sont pas affectés par cette balise META. Le contenu est une URL qui peut être une page relative ou absolue. Le schéma de l’URL peut être HTTP ou HTTPS. Vous devez définir des balises META mswebdialog-newwindowurl pour traiter les liens qui ne font pas partie du flux principal de l’utilisateur, tels que des déclarations de confidentialité, des formulaires de connexion, etc. Si vous prenez en charge la connexion avec un fournisseur d’authentification tiers (par exemple, les fournisseurs OpenID), prenez soin de conserver ces interactions dans le service Broker d’authentification Web. Pour activer tous les liens de votre page comme étant dignes de confiance pour être ouverts dans le navigateur, utilisez la syntaxe utilisant une étoile, par exemple <meta name="mswebdialog-newwindowurl" content="*"/>. Notez que l’étoile (« * ») ne peut être utilisée qu’exclusivement et ne peut pas être associée à une autre URL ; par exemple, "https://www.contoso.com/*" n’est pas une syntaxe valide.

Règles appliquées à toutes les balises META

Lorsque le service Broker d’authentification Web traite des balises META, les règles suivantes s’appliquent :

• L’effet de la balise META persiste sur toutes les pages situées sous le même domaine de second niveau (par exemple, contoso.com), sauf si une autre balise META ayant le même nom mais un contenu différent est rencontrée.
• Si plusieurs balises META de même nom sont rencontrées sur la même page, le service Broker d’authentification Web en choisit une seule et ignore les autres. Le choix de cette balise META spécifique n’est pas défini. Remarque  Cette règle ne s’applique pas à la balise META mswebdialog-newwindowurl qui autorise plusieurs instances sur la même page.  

Rubriques associées

Service Broker d’authentification Web

Exemple de service Broker d’authentification Web

Windows.Security.Authentication.Web