Inicio rápido: conectarse a un proveedor de identidad en línea (HTML)

Artículo
12/12/2015

[ Este artículo está destinado a desarrolladores de Windows 8.x y Windows Phone 8.x que escriben aplicaciones de Windows en tiempo de ejecución. Si estás desarrollando para Windows 10, consulta la documentación más reciente

En este tema se muestra cómo conecta tu aplicación de la Tienda Windows a un proveedor de identidad en línea que usa autenticación de Internet y protocolos de autorización como OpenID o OAuth

Las aplicaciones de la Tienda Windows usan un agente de autenticación web para conectarse a los proveedores de identidad en línea. Una aplicación llama al método AuthenticateAsync, que envía una solicitud al proveedor de identidades en Internet y obtiene un token de acceso que describe los recursos del proveedor a los que tiene acceso la aplicación. Para ver el ejemplo completo, consulta la muestra de agente de autenticación web. Para obtener más información sobre el agente de autenticación web, consulta Agente de autenticación web. Para conocer la documentación de referencia, consulta Windows.Security.Authentication.Web

Cuando hayas terminado este tema, consulta lo siguiente:

Requisitos previos

Debes estar familiarizado con JavaScript.
Debes estar familiarizado con los requisitos de autenticación de tu proveedor de identidad en línea.

Registrar la aplicación con un proveedor en línea

Debes registrar tu aplicación con el proveedor de identidad en línea con el cual quieres conectarte. Puedes averiguar cómo registrar tu aplicación con el proveedor de identidad. Después de registrarte, el proveedor en línea generalmente te otorga un identificador para tu aplicación.

Crear el URI de solicitud de autenticación

El URI de solicitud consta de la dirección desde la que envías la solicitud de autenticación a tu proveedor en línea anexada con otra información obligatoria, como un secreto o identificador de la aplicación, un URI de redirección donde se envía al usuario después de completar la autenticación, y el tipo de respuesta esperado. Puedes preguntarle al proveedor qué parámetros se requieren.

El URI de solicitud se envía como el parámetro requestUri del método authenticateAsync. Debe ser una dirección segura (debe comenzar con https://)

En el siguiente ejemplo se muestra cómo crear el URI de solicitud.


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

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

Conectarse al proveedor en línea

Llama al método authenticateAsync para conectarte al proveedor de identidad en línea y obtener un token de acceso. El método toma el URI creado en el paso anterior como el parámetro requestUri y un URI al que quieres que se redireccione el usuario como el parámetro callbackUri.

En el ejemplo siguiente se muestra cómo conectarse a un proveedor de identidad en línea.

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; 
            });

Conectar con inicio de sesión único (SSO)

De forma predeterminada, el agente de autenticación web no permite que haya cookies. Por esto, aunque el usuario de la aplicación indique que quiere mantener la sesión iniciada (por ejemplo, al activar una casilla en el cuadro de diálogo de inicio de sesión del proveedor), deberá iniciar sesión cada vez que quiera tener acceso a los recursos de dicho proveedor. Para iniciar sesión con SSO, el proveedor de identidad en línea debe haber habilitado SSO para el agente de autenticación web y la aplicación debe llamar la sobrecarga de authenticateAsync que no toma un parámetro callbackUri.

Para habilitar SSO, el proveedor en línea debe permitir registrar un URI de redirección en la forma de ms-app://appSID, donde appSID es el SID de tu aplicación. Puedes encontrar el SID de tu aplicación en la página del desarrollador en la Tienda de Windows o llamando al método getCurrentApplicationCallbackUri.

En el ejemplo siguiente se muestra cómo conectarse a un proveedor de identidad en línea con SSO.

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"); 
            });

Muestra una vista previa del estado autenticado de tu aplicación en Blend

Si usas authenitcateUserAsync para autenticar tu aplicación en tiempo de ejecución, puedes usar las mismas credenciales para acceder al estado autenticado de tu aplicación en Blend para Microsoft Visual Studio 2013. Eso significa que puedes abrir una versión autenticada de tu aplicación, hacer cambios en la apariencia y, después, mostrar una vista previa de los cambios que acabas de hacer, todo sin salir de Blend.

En Blend, en la categoría Tiempo de diseño del panel Dispositivo, selecciona Autenticación.
Presiona F5 para compilar e iniciar la aplicación.
Usa tus credenciales para iniciar sesión en tu aplicación.
Regresa a Blend y vuelve a cargar la aplicación.
Vuelve a la aplicación implementada y presiona Alt+F4 para cerrarla. Nota Solo se puede iniciar una instancia de la identidad de paquete de la aplicación al mismo tiempo. Como la vista autenticada de la aplicación en Blend usa la misma identidad de paquete que la versión implementada de la aplicación, la aplicación no se puede iniciar en segundo plano mientras se esté ejecutando también en Blend.
Regresa a Blend y continúa con tu trabajo.