Ajouter l’authentification à votre application Xamarin.iOS

2019-06-25

Android
Cordova
Ios
Windows
Xamarin.Android
Xamarin.Forms
Xamarin.iOS

Aperçu

Cette rubrique vous montre comment authentifier les utilisateurs d’une application mobile App Service à partir de votre application cliente. Dans ce tutoriel, vous ajoutez l’authentification au projet de démarrage rapide Xamarin.iOS à l’aide d’un fournisseur d’identité pris en charge par App Service. Une fois authentifié et autorisé par votre application mobile, la valeur de l’ID utilisateur s’affiche et vous pourrez accéder aux données de table restreintes.

Vous devez d’abord suivre le tutoriel Créer une application Xamarin.iOS. Si vous n’utilisez pas le projet de serveur de démarrage rapide téléchargé, vous devez ajouter le package d’extension d’authentification à votre projet. Pour plus d’informations sur les packages d’extension de serveur, consultez Utiliser le Kit de développement logiciel (SDK) du serveur principal .NET pour Azure Mobile Apps.

Inscrire votre application pour l’authentification et configurer App Services

Tout d’abord, vous devez inscrire votre application sur le site d’un fournisseur d’identité, puis définir les informations d’identification générées par le fournisseur dans le back-end Mobile Apps.

Configurez votre fournisseur d’identité préféré en suivant les instructions spécifiques au fournisseur :
- Azure Active Directory
- Facebook
- Google
- Microsoft
- twitter
Répétez les étapes précédentes pour chaque fournisseur que vous souhaitez prendre en charge dans votre application.

Ajouter votre application aux URL de redirection externe autorisées

L’authentification sécurisée nécessite que vous définissiez un nouveau schéma d’URL pour votre application. Cela permet au système d’authentification de revenir à votre application une fois le processus d’authentification terminé. Dans ce tutoriel, nous utilisons le schéma d’URL nom d’application dans l’ensemble. Toutefois, vous pouvez utiliser n’importe quel schéma d’URL que vous choisissez. Il doit être unique à votre application mobile. Pour activer la redirection côté serveur :

Dans le portail Azure, sélectionnez votre App Service.
Cliquez sur l’option de menu Authentification /Autorisation.
Dans les URL de redirection externe autorisées , entrez url_scheme_of_your_app://easyauth.callback. Le url_scheme_of_your_app dans cette chaîne de caractères est le schéma d'URL de votre application mobile. Il doit suivre la spécification d’URL normale pour un protocole (utilisez uniquement des lettres et des chiffres, puis commencez par une lettre). Vous devez noter la chaîne que vous choisissez, car vous devez ajuster votre code d’application mobile avec le schéma d’URL à plusieurs endroits.
Cliquez sur OK.
Cliquez sur Enregistrer.

Restreindre les autorisations aux utilisateurs authentifiés

Par défaut, les API d’un back-end Mobile Apps peuvent être appelées anonymement. Ensuite, vous devez restreindre l’accès aux clients authentifiés uniquement.

Node.js back-end (via le portail Azure) :

Dans vos paramètres Mobile Apps, cliquez sur Tables faciles et sélectionnez votre table. Cliquez sur Modifier les autorisations, sélectionnez accès authentifié uniquement pour toutes les autorisations, puis cliquez sur Enregistrer.
serveur principal .NET (C#):

Dans le projet de serveur, accédez à Controllers>TodoItemController.cs. Ajoutez l’attribut [Authorize] à la classe TodoItemController, comme suit. Pour restreindre l’accès uniquement à des méthodes spécifiques, vous pouvez également appliquer cet attribut uniquement à ces méthodes au lieu de la classe. Republiez le projet de serveur.
```
  [Authorize]
  public class TodoItemController : TableController<TodoItem>
```
Node.js backend (via Node.js code) :

Pour exiger l’authentification pour l’accès aux tables, ajoutez la ligne suivante au script serveur Node.js :
```
  table.access = 'authenticated';
```
Pour plus d’informations, consultez Procédure : Exiger l’authentification pour l’accès aux tables. Pour savoir comment télécharger le projet de code de démarrage rapide à partir de votre site, consultez Guide pratique pour télécharger le projet de code de démarrage rapide principal Node.js à l’aide de Git.

Dans Visual Studio ou Xamarin Studio, exécutez le projet client sur un appareil ou un émulateur. Vérifiez qu’une exception non gérée avec un code d’état 401 (non autorisé) est déclenchée après le démarrage de l’application. L’échec est enregistré dans la console du débogueur. Ainsi, dans Visual Studio, vous devez voir l’échec dans la fenêtre de sortie.

Cet échec non autorisé se produit parce que l’application tente d’accéder à votre serveur principal d’application mobile en tant qu’utilisateur non authentifié. La table TodoItem nécessite désormais l’authentification.

Ensuite, vous allez mettre à jour l’application cliente pour demander des ressources à partir du serveur principal de l’application mobile avec un utilisateur authentifié.

Ajouter l’authentification à l’application

Dans cette section, vous allez modifier l’application pour afficher un écran de connexion avant d’afficher les données. Au démarrage de l’application, elle ne se connecte pas à votre App Service et n’affiche aucune donnée. Après la première fois que l’utilisateur effectue le mouvement d’actualisation, l’écran de connexion s’affiche ; une fois la connexion réussie, la liste des éléments todo s’affiche.

Dans le projet client, ouvrez le fichier QSTodoService.cs et ajoutez l’instruction using suivante et MobileServiceUser avec accesseur à la classe QSTodoService :
```
using UIKit;

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

Ajoutez une nouvelle méthode nommée Authenticate to QSTodoService avec la définition suivante :

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

Remarque

Si vous utilisez un fournisseur d’identité autre qu’un Facebook, remplacez la valeur transmise à LoginAsync ci-dessus par l’une des options suivantes : MicrosoftAccount, Twitter, Google ou WindowsAzureActiveDirectory.

Ouvrez QSTodoListViewController.cs. Modifiez la définition de méthode de ViewDidLoad en supprimant l’appel à RefreshAsync() près de la fin :

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

Modifiez la méthode RefreshAsync pour vous authentifier si la propriété User a la valeur Null. Ajoutez le code suivant en haut de la définition de méthode :

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

Ouvrez AppDelegate.cs, ajoutez la méthode suivante :

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

Ouvrez le fichier Info.plist , accédez aux types d’URL dans la section Avancé . Configurez maintenant l’identificateur et les schémas d’URL de votre type d’URL, puis cliquez sur Ajouter un type d’URL. Les schémas d’URL doivent être identiques à votre {url_scheme_of_your_app}.
Dans Visual Studio, connecté à votre hôte Mac ou Visual Studio pour Mac, exécutez le projet client ciblant un appareil ou un émulateur. Vérifiez que l’application n’affiche aucune donnée.

Effectuez le geste d'actualisation en tirant vers le bas la liste des éléments, ce qui entraînera l’affichage de l'écran de connexion. Une fois que vous avez entré des informations d’identification valides, l’application affiche la liste des éléments todo et vous pouvez effectuer des mises à jour des données.

Partager via