Démarrage rapide : connexion à un fournisseur d’identité en ligne (HTML)

Article
12/11/2015

[ 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 ]

Cette rubrique vous explique comment connecter votre application du Windows Store à un fournisseur d’identité en ligne qui utilise des protocoles d’authentification et d’autorisation Internet comme OpenID ou OAuth.

Les applications du Windows Store utilisent le service Broker d’authentification Web pour se connecter à des fournisseurs d’identité en ligne. Une application appelle la méthode AuthenticateAsync, qui envoie une demande au fournisseur d’identité en ligne, puis obtient un jeton d’accès en retour qui décrit les ressources du fournisseur auxquelles l’application a accès. Pour obtenir l’exemple complet, voir Exemple de service Broker d’authentification Web. Pour plus d’informations sur le service Broker d’authentification Web, voir Service Broker d’authentification Web. Pour obtenir la documentation de référence, voir Windows.Security.Authentication.Web

À l’issue de cette rubrique, consultez les ressources suivantes :

Prérequis

Vous devez connaître JavaScript.
Vous devez connaître les exigences en matière d’authentification de votre fournisseur d’identité en ligne.

Inscrire votre application auprès de votre fournisseur en ligne

Vous devez inscrire votre application auprès du fournisseur d’identité en ligne auquel vous voulez vous connecter. Vous pouvez déterminer comment inscrire votre application auprès du fournisseur d’identité. Après l’inscription, le fournisseur en ligne vous donne généralement un ID pour votre application.

Créer l’URI de la demande d’authentification

L’URI de la demande se compose de l’adresse à laquelle vous envoyez la demande d’authentification à votre fournisseur en ligne, complétée par d’autres informations requises, comme un ID d’application ou secret, un URI de redirection où l’utilisateur est envoyé après avoir effectué l’authentification, ainsi que le type de réponse attendu. Vous pouvez déterminer auprès de votre fournisseur les paramètres requis.

L’URI de la demande est envoyé en tant que paramètre requestUri de la méthode authenticateAsync. Il doit s’agir d’une adresse sécurisée (commençant par https://).

L’exemple suivant explique comment créer l’URI de la demande.


        var startURL = "https://<providerendpoint>?client_id=<clientid>&scope=<scopes>&response_type=token"; 

        var startURI = new Windows.Foundation.Uri(startURL);

Se connecter au fournisseur en ligne

Vous appelez la méthode authenticateAsync pour vous connecter au fournisseur d’identité en ligne et obtenir un jeton d’accès. La méthode prend l’URI construit à l’étape précédente comme paramètre requestUri et un URI vers lequel vous voulez rediriger l’utilisateur comme paramètre callbackUri.

L’exemple suivant montre comment se connecter à un fournisseur d’identité en ligne.

authzInProgress = true; 
        Windows.Security.Authentication.Web.WebAuthenticationBroker.authenticateAsync( 
            Windows.Security.Authentication.Web.WebAuthenticationOptions.none, startURI,endURI) 
            .done(function (result) { 
                document.getElementById("AnyServiceReturnedToken").value = result.responseData; 
                document.getElementById("AnyServiceDebugArea").value += "Status returned by WebAuth broker: " + result.responseStatus + "\r\n"; 
                if (result.responseStatus === Windows.Security.Authentication.Web.WebAuthenticationStatus.errorHttp) { 
                    document.getElementById("AnyServiceDebugArea").value += "Error returned: " + result.responseErrorDetail + "\r\n"; 
                } 
                authzInProgress = false; 
            }, function (err) { 
                WinJS.log("Error returned by WebAuth broker: " + err, "Web Authentication SDK Sample", "error");         
                document.getElementById("AnyServiceDebugArea").value += " Error Message: " + err.message + "\r\n"; 
                authzInProgress = false; 
            });

Connexion par authentification unique

Par défaut, le service Broker d’authentification web n’autorise pas la persistance des cookies. C’est pourquoi, même si l’utilisateur de l’application indique qu’il souhaite rester connecté (par exemple, en activant une case à cocher dans la boîte de dialogue de connexion du fournisseur), il doit se connecter chaque fois qu’il souhaite accéder aux ressources de ce fournisseur. Pour se connecter avec l’authentification unique, votre fournisseur d’identité en ligne doit avoir activé l’authentification unique pour le service Broker d’authentification Web et votre application doit appeler la surcharge de la méthode authenticateAsync qui ne prend pas de paramètre callbackUri.

Pour prendre en charge l’authentification unique, le fournisseur en ligne doit vous permettre d’inscrire un URI de redirection sous la forme ms-app://appSID, où appSID correspond au SID de l’application. Vous pouvez obtenir le SID de votre application depuis la page du développeur Windows Store de votre application ou en appelant la méthode getCurrentApplicationCallbackUri.

L’exemple suivant montre comment se connecter à un fournisseur d’identité en ligne avec l’authentification unique.

var redirectURL = Windows.Security.Authentication.Web.WebAuthenticationBroker.getCurrentApplicationCallbackUri().absoluteUri;
        var startURL = "https://<providerendpoint>?client_id=<clientid>&redirect_uri=" + encodeURIComponent(redirectURL) + "&scope=<scopes>&response_type=token"; 

        var startURI = new Windows.Foundation.Uri(startURL); 

        Windows.Security.Authentication.Web.WebAuthenticationBroker.authenticateAsync( 
            Windows.Security.Authentication.Web.WebAuthenticationOptions.none, startURI) 
            .done(function (result) { 
                if (result.responseStatus === Windows.Security.Authentication.Web.WebAuthenticationStatus.errorHttp) { 
                    document.getElementById("FacebookDebugArea").value += "Error returned: " + result.responseErrorDetail + "\r\n"; 
                } 

                // Parse out the OAuth token from result.responseData 

            }, function (err) { 
                WinJS.log("Error returned by WebAuth broker: " + err, "Web Authentication SDK Sample", "error"); 
            });

Aperçu de l’état de votre application authentifiée dans Blend

Si vous utilisez authenitcateUserAsync pour authentifier votre application au moment de l’exécution, vous pouvez utiliser ces mêmes informations d’identification pour accéder à l’état authentifié de votre application dans Blend pour Microsoft Visual Studio 2013. Cela signifie que vous pouvez ouvrir une version authentifiée de votre application, apporter des modifications à l’apparence, puis afficher un aperçu des modifications que vous venez d’apporter, le tout sans quitter Blend.

Dans Blend, dans la catégorie Moment de la conception du panneau Appareil sélectionnez Authentification.
Appuyez sur la touche F5 pour générer et exécuter votre application.
Utilisez vos informations d’identification pour vous connecter à votre application.
Retournez à Blend et rechargez votre application.
Retournez à l’application déployée, puis appuyez sur Alt+F4 pour la fermer. Remarque Une seule instance de l’identité du package d’application peut s’exécuter à la fois. Étant donné que l’affichage authentifié de l’application dans Blend utilise la même identité de package que la version déployée de votre application, votre application ne peut pas s’exécuter en arrière-plan si elle s’exécute également dans Blend.
Retournez à Blend pour poursuivre votre travail.

Récapitulatif

Dans cette rubrique, nous vous avons montré comment vous connecter à un fournisseur d’identité en ligne, à la fois avec et sans l’authentification unique activée.

Rubriques associées

Développement d’applications du Windows Store

Exemple de service Broker d’authentification Web

Service Broker d’authentification Web

Windows.Security.Authentication.Web

Partager via