Adición de la autenticación a la aplicación Xamarin.iOS

Artículo
06/25/2019

Información general

En este tema se muestra cómo autenticar usuarios de una Aplicación móvil de App Service desde la aplicación cliente. En este tutorial podrá agregar la autenticación al proyecto de inicio rápido Xamarin.iOS mediante un proveedor de identidades compatible con App Service. Una vez que la aplicación móvil haya realizado la autenticación y autorización correctamente, se mostrará el valor de identificador de usuario y podrá tener acceso a datos de tabla restringida.

Primero debe completar el tutorial Creación de una aplicación Xamarin.iOS. Si no usa el proyecto de servidor de inicio rápido descargado, debe agregar el paquete de extensión de autenticación al proyecto. Para obtener más información acerca de los paquetes de extensión de servidor, consulte Trabajar con el SDK del servidor back-end de .NET para Aplicaciones móviles de Azure.

Registro de la aplicación para la autenticación y configuración de App Services

En primer lugar, debe registrar la aplicación en el sitio del proveedor de identidades y, a continuación, establecerá las credenciales generadas por el proveedor en el back-end de Mobile Apps.

Configure el proveedor de identidades preferido siguiendo las instrucciones específicas del proveedor:
Repita los pasos anteriores para cada proveedor que desee admitir en su aplicación.

Adición de la aplicación a las direcciones URL de redirección externa permitidas

La autenticación segura requiere que se defina un nuevo esquema de dirección URL para la aplicación. Esto permite que el sistema de autenticación se redirija a la aplicación una vez completado el proceso de autenticación. En este tutorial, se usará el esquema de dirección URL appname. Sin embargo, puede utilizar cualquier otro esquema de dirección URL que elija. Debe ser único para la aplicación móvil. Para habilitar la redirección en el lado de servidor:

En Azure Portal, seleccione el servicio App Service.
Haga clic en la opción de menú Autenticación/autorización.
En URL de redirección externas permitidas, introduzca url_scheme_of_your_app://easyauth.callback. El valor de esquema_de_dirección_URL_de_la_aplicación de esta cadena es el esquema de dirección URL para la aplicación móvil. Debe seguir la especificación normal de las direcciones URL para un protocolo (usar únicamente letras y números, y comenzar por una letra). Debe tomar nota de la cadena que elija ya que necesitará ajustar el código de la aplicación móvil con el esquema de direcciones URL en varios sitios.
Haga clic en OK.
Haga clic en Save(Guardar).

Restricción de los permisos para los usuarios autenticados

De forma predeterminada, se pueden invocar las API en un back-end de Mobile Apps de forma anónima. A continuación, deberá restringir el acceso a solo los clientes autenticados.

Back-end de Node.js (a través de Azure Portal):

En la configuración Mobile Apps, haga clic en Tablas fáciles y seleccione la tabla. Haga clic en Cambiar permisos, seleccione Solo acceso autenticado para todos los permisos y luego haga clic en Guardar.
Back-end de .NET (C#):

En el proyecto de servidor, vaya aControllersTodoItemController.cs>. Agregue el atributo [Authorize] a la clase TodoItemController , como sigue. Para restringir el acceso solo a determinados métodos, también puede aplicar este atributo solo a esos métodos en lugar de la clase. Vuelva a publicar el proyecto de servidor.
```
  [Authorize]
  public class TodoItemController : TableController<TodoItem>
```
Back-end de Node.js (a través del código de Node.js) :

Para pedir autenticación para acceder a las tablas, agregue la siguiente línea al script del servidor de Node.js:
```
  table.access = 'authenticated';
```
Para más información, consulte Autenticación necesaria para el acceso a las tablas. Para obtener información sobre cómo descargar el proyecto de código de inicio rápido desde su sitio, consulte Cómo: descargar el proyecto de código de inicio rápido de back-end de Node.js con Git.

En Visual Studio o Xamarin Studio, ejecute el proyecto de cliente en un dispositivo o emulador. Compruebe que se produce una excepción no controlada con el código de estado 401 (No autorizado) después de iniciarse la aplicación. El error se registra en la consola del depurador. De esta forma, en Visual Studio, debería ver el error en la ventana de salida.

Este error no autorizado se produce porque la aplicación intenta acceder al back-end de la aplicación móvil como usuario no autenticado. La tabla TodoItem ahora requiere autenticación.

Luego, actualizará la aplicación cliente para solicitar recursos del back-end de la aplicación móvil con un usuario autenticado.

Incorporación de autenticación a la aplicación

En esta sección, modificará la aplicación para mostrar una pantalla de inicio de sesión antes de mostrar los datos. Cuando se inicie la aplicación, no se conectará a App Service y no mostrará datos. Después de que el usuario intente actualizar una vez, aparecerá la pantalla de inicio y, una vez que haya iniciado sesión, se mostrará la lista de tareas pendientes.

En el proyecto de cliente, abra el archivo QSTodoService.cs y agregue la siguiente instrucción using y MobileServiceUser, con descriptor de acceso a la clase QSTodoService:
```
using UIKit;

// Logged in user
private MobileServiceUser user;
public MobileServiceUser User { get { return user; } }
```

Agregue un nuevo método denominado Authenticate a QSTodoService con la siguiente definición:

public async Task Authenticate(UIViewController view)
{
    try
    {
        AppDelegate.ResumeWithURL = url => url.Scheme == "{url_scheme_of_your_app}" && client.ResumeWithURL(url);
        user = await client.LoginAsync(view, MobileServiceAuthenticationProvider.Facebook, "{url_scheme_of_your_app}");
    }
    catch (Exception ex)
    {
        Console.Error.WriteLine (@"ERROR - AUTHENTICATION FAILED {0}", ex.Message);
    }
}

Nota

Si usa un proveedor de identidades que no sea una cuenta de Facebook, cambie el valor que usó con LoginAsync por uno de los siguientes: MicrosoftAccount, Twitter, Google o WindowsAzureActiveDirectory.

Abra QSTodoListViewController.cs. Modifique la definición del método de ViewDidLoad, para lo que debe quitar la llamada a RefreshAsync() cerca del final:

public override async void ViewDidLoad ()
{
    base.ViewDidLoad ();

    todoService = QSTodoService.DefaultService;
    await todoService.InitializeStoreAsync();

    RefreshControl.ValueChanged += async (sender, e) => {
        await RefreshAsync();
    }

    // Comment out the call to RefreshAsync
    // await RefreshAsync();
}

Modifique el método RefreshAsync para autenticar si el valor de la propiedad User es null. Agregue el siguiente código al principio de la definición del método:

// start of RefreshAsync method
if (todoService.User == null) {
    await QSTodoService.DefaultService.Authenticate(this);
    if (todoService.User == null) {
        Console.WriteLine("couldn't login!!");
        return;
    }
}
// rest of RefreshAsync method

Abra AppDelegate.cs y agregue el siguiente método:

public override bool OpenUrl(UIApplication app, NSUrl url, NSDictionary options)
{
    if (client.ResumeWithURL(app, url, options))
        return true;
    return base.OpenUrl(app, url, options);
}

Abra el archivo Info.plist, vaya a Tipos de URL en la sección Opciones avanzadas. Ahora, configure el Identificador y los Esquemas de URL de su tipo de dirección URL y haga clic en Agregar tipo de dirección URL. El valor de Esquemas de URL debe ser el mismo que el de {url_scheme_of_your_app}.
En Visual Studio, conectado a su host de Mac, o Visual Studio para Mac, ejecute el proyecto de cliente destinado a un dispositivo o un emulador. Compruebe que la aplicación no muestra ningún dato.

Despliegue la lista de tareas para actualizar la pantalla, lo que dará lugar a que aparezca la pantalla de inicio de sesión. Una vez que haya proporcionado credenciales válidas, la aplicación mostrará la lista de tareas pendientes y podrá actualizar los datos.

Compartir a través de