Servicios de autenticación externos con ASP.NET WEB API (C#)
Para el nuevo desarrollo de aplicaciones web, se recomiendan API mínimas
Se recomienda usar la opción de autenticación segura más segura. Para las aplicaciones .NET implementadas en Azure, consulte:
Azure Key Vault y .NET Aspire proporcionan la manera más segura de almacenar y recuperar secretos. Azure Key Vault es un servicio en la nube que protege las claves de cifrado y los secretos, como certificados, cadenas de conexión y contraseñas. Para .NET Aspire, consulte Comunicación segura entre las integraciones de hospedaje y cliente.
Evite la concesión de credenciales de contraseña del propietario del recurso porque:
- Expone la contraseña del usuario al cliente.
- Es un riesgo de seguridad significativo.
- Solo se debe usar cuando no se puedan usar otros flujos de autenticación.
Cuando la aplicación se implementa en un servidor de prueba, se puede usar una variable de entorno para establecer la cadena de conexión en un servidor de base de datos de prueba. Las variables de entorno se almacenan generalmente en texto sin cifrar. Si la máquina o el proceso están en peligro, las partes que no son de confianza pueden acceder a las variables de entorno. Se desaconseja usar variables de entorno para almacenar una cadena de conexión de producción, ya que no es el enfoque más seguro.
Directrices de datos de configuración:
- Nunca almacene contraseñas u otros datos confidenciales en el código del proveedor de configuración o en archivos de configuración de texto sin formato.
- No use secretos de producción en entornos de desarrollo o pruebas.
- Especifique secretos fuera del proyecto para que no se puedan confirmar accidentalmente en un repositorio de código fuente.
Visual Studio 2017 y ASP.NET 4.7.2 amplían las opciones de seguridad para aplicaciones de página única (SPA) y servicios de API web para integrarse con servicios de autenticación externos, que incluyen varios servicios de autenticación OAuth/OpenID y de redes sociales: Cuentas de Microsoft, Twitter, Facebook y Google.
En este tutorial
Prerrequisitos
Para seguir los ejemplos de este tutorial, debe tener lo siguiente:
Visual Studio 2017
Una cuenta de desarrollador con el identificador de aplicación y la clave secreta para uno de los siguientes servicios de autenticación de redes sociales:
- Cuentas Microsoft (https://go.microsoft.com/fwlink/?LinkID=144070)
- Twitter (https://dev.twitter.com/)
- Facebook (https://developers.facebook.com/)
- Google (https://developers.google.com/)
Uso de servicios de autenticación externa
La abundancia de servicios de autenticación externos que están disponibles actualmente para los desarrolladores web ayudan a reducir el tiempo de desarrollo al crear nuevas aplicaciones web. Normalmente, los usuarios web tienen varias cuentas existentes para servicios web populares y sitios web de redes sociales, por lo que cuando una aplicación web implementa los servicios de autenticación desde un servicio web externo o un sitio web de redes sociales, ahorra el tiempo de desarrollo que se habría dedicado a crear una implementación de autenticación. El uso de un servicio de autenticación externo evita que los usuarios finales tengan que crear otra cuenta para la aplicación web y también tener que recordar otro nombre de usuario y contraseña.
En el pasado, los desarrolladores han tenido dos opciones: crear su propia implementación de autenticación o aprender a integrar un servicio de autenticación externo en sus aplicaciones. En el nivel más básico, en el diagrama siguiente se muestra un flujo de solicitud simple para un agente de usuario (explorador web) que solicita información de una aplicación web configurada para usar un servicio de autenticación externo:
En el diagrama anterior, el agente de usuario (o explorador web de este ejemplo) realiza una solicitud a una aplicación web, que redirige el explorador web a un servicio de autenticación externo. El agente de usuario envía sus credenciales al servicio de autenticación externo y, si el agente de usuario se ha autenticado correctamente, el servicio de autenticación externa redirigirá al agente de usuario a la aplicación web original con algún tipo de token que el agente de usuario enviará a la aplicación web. La aplicación web usará el token para comprobar que el agente de usuario se ha autenticado correctamente mediante el servicio de autenticación externo y la aplicación web puede usar el token para recopilar más información sobre el agente de usuario. Una vez que la aplicación haya terminado de procesar la información del agente de usuario, la aplicación web devolverá la respuesta adecuada al agente de usuario en función de su configuración de autorización.
En este segundo ejemplo, el agente de usuario negocia con la aplicación web y el servidor de autorización externo, y la aplicación web realiza una comunicación adicional con el servidor de autorización externo para recuperar información adicional sobre el agente de usuario:
Visual Studio 2017 y ASP.NET 4.7.2 facilitan la integración con servicios de autenticación externos para los desarrolladores proporcionando integración integrada para los siguientes servicios de autenticación:
- Cuentas Microsoft (cuentas de Windows Live ID)
En los ejemplos de este tutorial se muestra cómo configurar cada uno de los servicios de autenticación externos admitidos mediante la nueva plantilla de aplicación web de ASP.NET que se incluye con Visual Studio 2017.
Nota
Si es necesario, es posible que tenga que agregar el FQDN a la configuración del servicio de autenticación externo. Este requisito se basa en restricciones de seguridad para algunos servicios de autenticación externos que requieren el FQDN en la configuración de la aplicación para que coincida con el FQDN que usan los clientes. (Los pasos para esto variarán considerablemente para cada servicio de autenticación externo; deberá consultar la documentación de cada servicio de autenticación externo para ver si esto es necesario y cómo configurar estas opciones). Si necesita configurar IIS Express para usar un FQDN para probar este entorno, consulte la sección Configuración de IIS Express para usar un nombre de dominio completo más adelante en este tutorial.
Creación de una aplicación web de ejemplo
Los pasos siguientes le guiarán a través de la creación de una aplicación de ejemplo mediante la plantilla aplicación web de ASP.NET, y usará esta aplicación de ejemplo para cada uno de los servicios de autenticación externos más adelante en este tutorial.
Inicie Visual Studio 2017 y seleccione Nuevo proyecto en la página Inicio. O bien, en el menú Archivo, seleccione Nuevo y, a continuación, Proyecto.
Cuando se muestre el cuadro de diálogo Nuevo proyecto, seleccione Instalado y expanda Visual C#. En Visual C#, seleccione Web. En la lista de plantillas de proyecto, seleccione ASP.NET Aplicación web (.Net Framework). Escriba el nombre del proyecto y haga clic en Aceptar.
Cuando se muestra el Nuevo proyecto de ASP.NET, seleccione la plantilla Aplicación de Página Única y haga clic en Crear Proyecto.
Espere a que Visual Studio 2017 cree el proyecto.
Cuando Visual Studio 2017 haya terminado de crear el proyecto, abra el archivo Startup.Auth.cs que se encuentra en la carpeta App_Start.
Cuando se crea por primera vez el proyecto, ninguno de los servicios de autenticación externa está habilitado en Startup.Auth.cs archivo; A continuación se muestra el aspecto que podría tener el código, con las secciones resaltadas para dónde habilitaría un servicio de autenticación externo y cualquier configuración pertinente para usar cuentas de Microsoft, Twitter, Facebook o autenticación de Google con la aplicación de ASP.NET:
using System;
using Microsoft.AspNet.Identity;
using Microsoft.AspNet.Identity.EntityFramework;
using Microsoft.AspNet.Identity.Owin;
using Microsoft.Owin;
using Microsoft.Owin.Security.Cookies;
using Microsoft.Owin.Security.DataProtection;
using Microsoft.Owin.Security.Google;
using Microsoft.Owin.Security.OAuth;
using Owin;
using WebApplication1.Models;
using WebApplication1.Providers;
namespace WebApplication1
{
public partial class Startup
{
// Enable the application to use OAuthAuthorization. You can then secure your Web APIs
static Startup()
{
PublicClientId = "web";
OAuthOptions = new OAuthAuthorizationServerOptions
{
TokenEndpointPath = new PathString("/Token"),
AuthorizeEndpointPath = new PathString("/Account/Authorize"),
Provider = new ApplicationOAuthProvider(PublicClientId),
AccessTokenExpireTimeSpan = TimeSpan.FromDays(14),
AllowInsecureHttp = true
};
}
public static OAuthAuthorizationServerOptions OAuthOptions { get; private set; }
public static string PublicClientId { get; private set; }
// For more information on configuring authentication, please visit https://go.microsoft.com/fwlink/?LinkId=301864
public void ConfigureAuth(IAppBuilder app)
{
// Configure the db context, user manager and signin manager to use a single instance per request
app.CreatePerOwinContext(ApplicationDbContext.Create);
app.CreatePerOwinContext<ApplicationUserManager>(ApplicationUserManager.Create);
app.CreatePerOwinContext<ApplicationSignInManager>(ApplicationSignInManager.Create);
// Enable the application to use a cookie to store information for the signed in user
app.UseCookieAuthentication(new CookieAuthenticationOptions
{
AuthenticationType = DefaultAuthenticationTypes.ApplicationCookie,
LoginPath = new PathString("/Account/Login"),
Provider = new CookieAuthenticationProvider
{
// Enables the application to validate the security stamp when the user logs in.
// This is a security feature which is used when you change a password or add an external login to your account.
OnValidateIdentity = SecurityStampValidator.OnValidateIdentity<ApplicationUserManager, ApplicationUser>(
validateInterval: TimeSpan.FromMinutes(20),
regenerateIdentity: (manager, user) => user.GenerateUserIdentityAsync(manager))
}
});
// Use a cookie to temporarily store information about a user logging in with a third party login provider
app.UseExternalSignInCookie(DefaultAuthenticationTypes.ExternalCookie);
// Enables the application to temporarily store user information when they are verifying the second factor in the two-factor authentication process.
app.UseTwoFactorSignInCookie(DefaultAuthenticationTypes.TwoFactorCookie, TimeSpan.FromMinutes(5));
// Enables the application to remember the second login verification factor such as phone or email.
// Once you check this option, your second step of verification during the login process will be remembered on the device where you logged in from.
// This is similar to the RememberMe option when you log in.
app.UseTwoFactorRememberBrowserCookie(DefaultAuthenticationTypes.TwoFactorRememberBrowserCookie);
// Enable the application to use bearer tokens to authenticate users
app.UseOAuthBearerTokens(OAuthOptions);
// Uncomment the following lines to enable logging in with third party login providers
//app.UseMicrosoftAccountAuthentication(
// clientId: "",
// clientSecret: "");
//app.UseTwitterAuthentication(
// consumerKey: "",
// consumerSecret: "");
//app.UseFacebookAuthentication(
// appId: "",
// appSecret: "");
//app.UseGoogleAuthentication(new GoogleOAuth2AuthenticationOptions()
//{
// ClientId = "",
// ClientSecret = ""
//});
}
}
}
Al presionar F5 para compilar y depurar la aplicación web, se mostrará una pantalla de inicio de sesión donde verá que no se han definido servicios de autenticación externos.
En las secciones siguientes, aprenderá a habilitar cada uno de los servicios de autenticación externos que se proporcionan con ASP.NET en Visual Studio 2017.
Habilitación de la autenticación de Facebook
El uso de la autenticación de Facebook requiere que cree una cuenta de desarrollador de Facebook y el proyecto requerirá un identificador de aplicación y una clave secreta de Facebook para poder funcionar. Para obtener información sobre cómo crear una cuenta de desarrollador de Facebook y obtener el identificador de aplicación y la clave secreta, consulte https://go.microsoft.com/fwlink/?LinkID=252166.
Una vez que haya obtenido el identificador de aplicación y la clave secreta, siga estos pasos para habilitar la autenticación de Facebook para la aplicación web:
Cuando el proyecto esté abierto en Visual Studio 2017, abra el archivo Startup.Auth.cs.
Busque la sección de autenticación de Facebook del código:
// Uncomment the following lines to enable logging in with third party login providers //app.UseMicrosoftAccountAuthentication( // clientId: "", // clientSecret: ""); //app.UseTwitterAuthentication( // consumerKey: "", // consumerSecret: ""); //app.UseFacebookAuthentication( // appId: "", // appSecret: ""); //app.UseGoogleAuthentication(new GoogleOAuth2AuthenticationOptions() //{ // ClientId = "", // ClientSecret = "" //});Quite los caracteres "//" para quitar la marca de comentario de las líneas de código resaltadas y agregue el identificador de aplicación y la clave secreta. Una vez agregados esos parámetros, puede volver a compilar el proyecto:
// Uncomment the following lines to enable logging in with third party login providers //app.UseMicrosoftAccountAuthentication( // clientId: "", // clientSecret: ""); //app.UseTwitterAuthentication( // consumerKey: "", // consumerSecret: ""); //app.UseFacebookAuthentication( // appId: "426f62526f636b73", // appSecret: ""); //app.UseGoogleAuthentication();Al presionar F5 para abrir la aplicación web en el explorador web, verá que Facebook se ha definido como un servicio de autenticación externo:
Al hacer clic en el botón Facebook, el explorador se redirigirá a la página de inicio de sesión de Facebook:
Después de escribir sus credenciales de Facebook y hacer clic en Iniciar sesión, el explorador web se redirigirá de nuevo a la aplicación web, lo que le pedirá el nombre de usuario de que desea asociar con su cuenta de Facebook:
Después de escribir el nombre de usuario y hacer clic en el botón Registrarse, la aplicación web mostrará la página principal predeterminada para su cuenta de Facebook:
Habilitación de la autenticación de Google
El uso de la autenticación de Google requiere que cree una cuenta de desarrollador de Google y el proyecto requerirá un identificador de aplicación y una clave secreta de Google para poder funcionar. Para obtener información sobre cómo crear una cuenta de desarrollador de Google y obtener el identificador de aplicación y la clave secreta, consulte https://developers.google.com.
Para habilitar la autenticación de Google para la aplicación web, siga estos pasos:
Cuando el proyecto esté abierto en Visual Studio 2017, abra el archivo Startup.Auth.cs.
Busque la sección de autenticación de Google del código:
// Uncomment the following lines to enable logging in with third party login providers //app.UseMicrosoftAccountAuthentication( // clientId: "", // clientSecret: ""); //app.UseTwitterAuthentication( // consumerKey: "", // consumerSecret: ""); //app.UseFacebookAuthentication( // appId: "", // appSecret: ""); //app.UseGoogleAuthentication(new GoogleOAuth2AuthenticationOptions() //{ // ClientId = "", // ClientSecret = "" //});Quite los caracteres "//" para quitar la marca de comentario de las líneas de código resaltadas y agregue el identificador de aplicación y la clave secreta. Una vez agregados esos parámetros, puede volver a compilar el proyecto:
// Uncomment the following lines to enable logging in with third party login providers //app.UseMicrosoftAccountAuthentication( // clientId: "", // clientSecret: ""); //app.UseTwitterAuthentication( // consumerKey: "", // consumerSecret: ""); //app.UseFacebookAuthentication( // appId: "", // appSecret: ""); app.UseGoogleAuthentication(new GoogleOAuth2AuthenticationOptions() { ClientId = "477522346600.apps.googleusercontent.com", ClientSecret = "gobkdpbocikdfbnfahjladnetpdkvmic" });Al presionar F5 para abrir la aplicación web en el explorador web, verá que Google se ha definido como un servicio de autenticación externo:
Al hacer clic en el botón Google, el navegador se redirigirá a la página de inicio de sesión de Google:
Después de escribir sus credenciales de Google y hacer clic en Iniciar sesión, Google le pedirá que compruebe que la aplicación web tiene permisos para acceder a su cuenta de Google:
Al hacer clic en Aceptar, el explorador web se redirigirá de nuevo a la aplicación web, que le pedirá el nombre de usuario que desea asociar a su cuenta de Google:
Después de escribir el nombre de usuario y hacer clic en el botón Registrarse, la aplicación web mostrará la página principal predeterminada para su cuenta de Google:
Habilitación de la autenticación de Microsoft
La autenticación de Microsoft requiere crear una cuenta de desarrollador y requiere un identificador de cliente y un secreto de cliente para poder funcionar. Para obtener información sobre cómo crear una cuenta de desarrollador de Microsoft y obtener el identificador de cliente y el secreto de cliente, consulte https://go.microsoft.com/fwlink/?LinkID=144070.
Una vez que haya obtenido la clave de consumidor y el secreto de consumidor, siga estos pasos para habilitar la autenticación de Microsoft para la aplicación web:
Cuando el proyecto esté abierto en Visual Studio 2017, abra el archivo Startup.Auth.cs.
Busque la sección de autenticación de Microsoft del código:
// Uncomment the following lines to enable logging in with third party login providers //app.UseMicrosoftAccountAuthentication( // clientId: "", // clientSecret: ""); //app.UseTwitterAuthentication( // consumerKey: "", // consumerSecret: ""); //app.UseFacebookAuthentication( // appId: "", // appSecret: ""); //app.UseGoogleAuthentication(new GoogleOAuth2AuthenticationOptions() //{ // ClientId = "", // ClientSecret = "" //});Quite los caracteres "//" para quitar la marca de comentario de las líneas de código resaltadas y agregue el identificador de cliente y el secreto de cliente. Una vez agregados esos parámetros, puede volver a compilar el proyecto:
// Uncomment the following lines to enable logging in with third party login providers app.UseMicrosoftAccountAuthentication( clientId: "426f62526f636b73", clientSecret: "57686f6120447564652c2049495320526f636b73"); //app.UseTwitterAuthentication( // consumerKey: "", // consumerSecret: ""); //app.UseFacebookAuthentication( // appId: "", // appSecret: ""); //app.UseGoogleAuthentication(new GoogleOAuth2AuthenticationOptions() //{ // ClientId = "", // ClientSecret = "" //});Al presionar F5 para abrir la aplicación web en el explorador web, verá que Microsoft se ha definido como un servicio de autenticación externo:
Al hacer clic en el botón Microsoft, el explorador se redirigirá a la página de inicio de sesión de Microsoft:
Después de escribir las credenciales de Microsoft y hacer clic en Iniciar sesión, se le pedirá que compruebe que la aplicación web tiene permisos para acceder a su cuenta microsoft:
Al hacer clic en Sí, el explorador web se redirigirá de nuevo a la aplicación web, lo que le pedirá el nombre de usuario de que desea asociar a su cuenta Microsoft:
Después de escribir el nombre de usuario y hacer clic en el botón Registrarse, la aplicación web mostrará la página principal predeterminada para su cuenta Microsoft:
Habilitación de la autenticación de Twitter
La autenticación de Twitter requiere crear una cuenta de desarrollador y requiere una clave de consumidor y un secreto de consumidor para poder funcionar. Para obtener información sobre cómo crear una cuenta de desarrollador de Twitter y obtener la clave de consumidor y el secreto de consumidor, consulte https://go.microsoft.com/fwlink/?LinkID=252166.
Una vez que haya obtenido la clave de consumidor y el secreto de consumidor, siga estos pasos para habilitar la autenticación de Twitter para la aplicación web:
Cuando el proyecto esté abierto en Visual Studio 2017, abra el archivo Startup.Auth.cs.
Localiza la sección de autenticación de Twitter del código:
// Uncomment the following lines to enable logging in with third party login providers //app.UseMicrosoftAccountAuthentication( // clientId: "", // clientSecret: ""); //app.UseTwitterAuthentication( // consumerKey: "", // consumerSecret: ""); //app.UseFacebookAuthentication( // appId: "", // appSecret: ""); //app.UseGoogleAuthentication(new GoogleOAuth2AuthenticationOptions() //{ // ClientId = "", // ClientSecret = "" //});Quite los caracteres "//" para quitar la marca de comentario de las líneas de código resaltadas y agregue la clave de consumidor y el secreto de consumidor. Una vez agregados esos parámetros, puede volver a compilar el proyecto:
// Uncomment the following lines to enable logging in with third party login providers //app.UseMicrosoftAccountAuthentication( // clientId: "", // clientSecret: ""); app.UseTwitterAuthentication( consumerKey: "426f62526f636b73", consumerSecret: "57686f6120447564652c2049495320526f636b73"); //app.UseFacebookAuthentication( // appId: "", // appSecret: ""); //app.UseGoogleAuthentication(new GoogleOAuth2AuthenticationOptions() //{ // ClientId = "", // ClientSecret = "" //});Al presionar F5 para abrir la aplicación web en el explorador web, verá que Twitter se ha definido como un servicio de autenticación externo:
Al hacer clic en el botón de Twitter , el explorador se redirigirá a la página de inicio de sesión de Twitter.
Después de escribir sus credenciales de Twitter y hacer clic en Autorizar aplicación, el explorador web se redirigirá de nuevo a la aplicación web, lo que le pedirá el nombre de usuario que desea asociar a su cuenta de Twitter:
Después de escribir el nombre de usuario y hacer clic en el botón Registrarse, la aplicación web mostrará la página principal predeterminada para su cuenta de Twitter:
Información adicional
Para obtener información adicional sobre cómo crear aplicaciones que usan OAuth y OpenID, consulte las direcciones URL siguientes:
Combinación de servicios de autenticación externa
Para mayor flexibilidad, puede definir varios servicios de autenticación externa al mismo tiempo: esto permite a los usuarios de la aplicación web usar una cuenta de cualquiera de los servicios de autenticación externos habilitados:
Configurar IIS Express para usar un nombre de dominio completo y calificado
Algunos proveedores de autenticación externos no admiten la prueba de la aplicación mediante una dirección HTTP como http://localhost:port/. Para solucionar este problema, puede agregar una asignación estática de nombre de dominio completo (FQDN) al archivo HOSTS y configurar las opciones del proyecto en Visual Studio 2017 para usar el FQDN para probar o depurar. Para ello, siga estos pasos:
Agregue un mapeo estático del FQDN en el archivo HOSTS.
Abra un símbolo del sistema con privilegios elevados en Windows.
Escriba el siguiente comando:
bloc de notas %WinDir%\system32\drivers\etc\hosts
Agregue una entrada como la siguiente al archivo HOSTS:
127.0.0.1 www.wingtiptoys.com
Guarde y cierre el archivo HOSTS.
Configure el proyecto de Visual Studio para usar el FQDN:
- Cuando el proyecto esté abierto en Visual Studio 2017, haga clic en el menú Proyecto y seleccione las propiedades del proyecto. Por ejemplo, puede seleccionar Propiedades de WebApplication1.
- Seleccione la pestaña Web.
- Escriba el FQDN para la dirección URL del proyecto. Por ejemplo, escriba http://www.wingtiptoys.com si ese fuera el mapeo de FQDN que agregó al archivo HOSTS.
Configure IIS Express para usar el FQDN para la aplicación:
Abra un símbolo del sistema con privilegios elevados en Windows.
Escriba el siguiente comando para cambiar a la carpeta IIS Express:
cd /d "%ProgramFiles%\IIS Express"
Escriba el siguiente comando para agregar el FQDN a la aplicación:
appcmd.exe set config -section:system.applicationHost/sites /+"[name='WebApplication1'].bindings.[protocol='http',bindingInformation='*:80:www.wingtiptoys.com']" /commit:apphost
Donde webApplication1 es el nombre del proyecto y bindingInformation contiene el número de puerto y el FQDN que desea usar para las pruebas.
Cómo obtener la configuración de la aplicación para la autenticación de Microsoft
Vincular una aplicación a Windows Live para la autenticación de Microsoft es un proceso sencillo. Si aún no ha vinculado una aplicación a Windows Live, puede seguir estos pasos:
Vaya a https://go.microsoft.com/fwlink/?LinkID=144070 y escriba el nombre y la contraseña de la cuenta Microsoft cuando se le solicite y haga clic en Iniciar sesión:
Seleccione Agregar una aplicación y escriba el nombre de la aplicación cuando se le solicite y haga clic en Crear:
Seleccione la aplicación en Nombre y aparecerá su página de propiedades de la aplicación.
Escriba el dominio de redireccionamiento de la aplicación. Copie el ID de aplicación y, en Secretos de aplicación , seleccione generar contraseña . Copie la contraseña que aparece. El identificador y la contraseña de la aplicación son el identificador de cliente y el secreto de cliente. Seleccione Aceptar y, después, Guardar.
Opcional: Deshabilitar el registro local
La funcionalidad actual de registro local ASP.NET no impide que los programas automatizados (bots) creen cuentas de miembro; por ejemplo, mediante el uso de una tecnología de prevención y validación de bots, como CAPTCHA. Por este motivo, debe quitar el formulario de inicio de sesión local y el vínculo de registro en la página de inicio de sesión. Para ello, abra la página
<!-- ko with: login -->
<hgroup class="title">
<h1>Log in</h1>
</hgroup>
<div class="row-fluid">
@*<section class="span7">
<form>
<fieldset class="form-horizontal">
<legend>Use a local account to log in.</legend>
<ul class="text-error" data-bind="foreach: errors">
<li data-bind="text: $data"></li>
</ul>
<div class="control-group">
<label for="UserName" class="control-label">User name</label>
<div class="controls">
<input type="text" name="UserName" data-bind="value: userName, hasFocus: true" />
<span class="text-error" data-bind="visible: userName.hasError, text: userName.errorMessage"></span>
</div>
</div>
<div class="control-group">
<label for="Password" class="control-label">Password</label>
<div class="controls">
<input type="password" name="Password" data-bind="value: password" />
<span class="text-error" data-bind="visible: password.hasError, text: password.errorMessage"></span>
</div>
</div>
<div class="control-group">
<div class="controls">
<label class="checkbox">
<input type="checkbox" name="RememberMe" data-bind="checked: rememberMe" />
<label for="RememberMe">Remember me?</label>
</label>
</div>
</div>
<div class="form-actions no-color">
<button type="submit" class="btn" data-bind="click: login, disable: loggingIn">Log in</button>
</div>
<p><a href="#" data-bind="click: register">Register</a> if you don't have a local account.</p>
</fieldset>
</form>
</section>*@
<section class="span5">
<h2>Log in using another service</h2>
<div data-bind="visible: loadingExternalLogin">Loading...</div>
<div data-bind="visible: !loadingExternalLogin()">
<div class="message-info" data-bind="visible: !hasExternalLogin()">
<p>
There are no external authentication services configured. See <a href="https://go.microsoft.com/fwlink/?LinkId=252166">this article</a>
for details on setting up this ASP.NET application to support logging in via external services.
</p>
</div>
<form data-bind="visible: hasExternalLogin">
<fieldset class="form-horizontal">
<legend>Use another service to log in.</legend>
<p data-bind="foreach: externalLoginProviders">
<button type="submit" class="btn" data-bind="text: name, attr: { title: 'Log in using your ' + name() + ' account' }, click: login"></button>
</p>
</fieldset>
</form>
</div>
</section>
</div>
<!-- /ko -->
Una vez deshabilitado el panel de inicio de sesión local y el vínculo de registro, la página de inicio de sesión solo mostrará los proveedores de autenticación externos que ha habilitado:
