Aggiungere l'autenticazione all'app per Xamarin.AndroidAdd authentication to your Xamarin.Android app

Questo argomento descrive come autenticare gli utenti di un'app per dispositivi mobili dall'applicazione client.This topic shows you how to authenticate users of a Mobile App from your client application. In questa esercitazione si aggiungerà l'autenticazione al progetto di guida introduttiva tramite un provider di identità supportato dal servizio App per dispositivi mobili di Azure.In this tutorial, you add authentication to the quickstart project using an identity provider that is supported by Azure Mobile Apps. Una volta completate l'autenticazione e l'autorizzazione nell'app per dispositivi mobili, verrà visualizzato il valore dell'ID utente.After being successfully authenticated and authorized in the Mobile App, the user ID value is displayed.

Questa esercitazione è basata sulla guida introduttiva dell'app mobile.This tutorial is based on the Mobile App quickstart. È anche necessario completare prima l'esercitazione Creare un'app per Xamarin.Android.You must also first complete the tutorial [Create a Xamarin.Android app]. Se non si usa il progetto server di avvio rapido scaricato, è necessario aggiungere il pacchetto di estensione di autenticazione al progetto.If you do not use the downloaded quick start server project, you must add the authentication extension package to your project. Per altre informazioni sui pacchetti di estensione server, vedere l'articolo relativo all' utilizzo dell'SDK del server back-end .NET per app per dispositivi mobili di Azure.For more information about server extension packages, see Work with the .NET backend server SDK for Azure Mobile Apps.

Registrare l'app per l'autenticazione e configurare i servizi appRegister your app for authentication and configure App Services

Innanzitutto, è necessario registrare l'app nel sito di un provider di identità e quindi impostare le credenziali generate dal provider nel back-end dell'app per dispositivi mobili.First, you need to register your app at an identity provider's site, and then you will set the provider-generated credentials in the Mobile Apps back end.

  1. Configurare il provider di identità preferito seguendo le istruzioni specifiche del provider:Configure your preferred identity provider by following the provider-specific instructions:

  2. Ripetere i passaggi precedenti per ogni provider di cui si desidera il supporto nell'app.Repeat the previous steps for each provider you want to support in your app.

Aggiungere l'app agli URL di reindirizzamento esterni consentitiAdd your app to the Allowed External Redirect URLs

L'autenticazione sicura richiede la definizione di un nuovo schema URL per l'app.Secure authentication requires that you define a new URL scheme for your app. In questo modo il sistema di autenticazione reindirizza all'app al termine del processo di autenticazione.This allows the authentication system to redirect back to your app once the authentication process is complete. In questa esercitazione si usa lo schema URL appname.In this tutorial, we use the URL scheme appname throughout. È tuttavia possibile usare QUALSIASI schema URL.However, you can use any URL scheme you choose. Lo schema deve essere univoco per l'applicazione per dispositivi mobili.It should be unique to your mobile application. Per abilitare il reindirizzamento sul lato server:To enable the redirection on the server side:

  1. Nel [portale di Azure] selezionare il servizio app.In the [Azure portal], select your App Service.

  2. Fare clic sull'opzione di menu Autenticazione/Autorizzazione.Click the Authentication / Authorization menu option.

  3. In URL di reindirizzamento esterni consentiti specificare url_scheme_of_your_app://easyauth.callback.In the Allowed External Redirect URLs, enter url_scheme_of_your_app://easyauth.callback. Il valore url_scheme_of_your_app in questa stringa è lo schema URL per l'applicazione per dispositivi mobili.The url_scheme_of_your_app in this string is the URL Scheme for your mobile application. Deve seguire le normale specifica URL per un protocollo, ovvero usare solo lettere e numeri e iniziare con una lettera.It should follow normal URL specification for a protocol (use letters and numbers only, and start with a letter). È opportuno prendere nota della stringa scelta perché sarà necessario modificare il codice dell'applicazione per dispositivi mobili con lo schema URL in diverse posizioni.You should make a note of the string that you choose as you will need to adjust your mobile application code with the URL Scheme in several places.

  4. Fare clic su OK.Click OK.

  5. Fare clic su Save.Click Save.

Limitare le autorizzazioni agli utenti autenticatiRestrict permissions to authenticated users

Per impostazione predefinita, le API in un back-end dell'app per dispositivi mobili possono essere richiamate in modo anonimo.By default, APIs in a Mobile Apps back end can be invoked anonymously. È necessario limitare l'accesso solo ai client autenticati.Next, you need to restrict access to only authenticated clients.

  • Back-end Node. js nuovamente fine (tramite il Portale di Azure) :Node.js back end (via the Azure portal) :

    Nelle impostazioni dell'app per dispositivi mobili fare clic su Tabelle semplici e selezionare la tabella.In your Mobile Apps settings, click Easy Tables and select your table. Fare clic su Modifica autorizzazioni, selezionare Authenticated access only (Solo accesso con autenticazione) per tutte le autorizzazioni e quindi fare clic su Salva.Click Change permissions, select Authenticated access only for all permissions, and then click Save.

  • Back-end. NET (C#):.NET back end (C#):

    Nel progetto server passare a Controller > TodoItemController.cs.In the server project, navigate to Controllers > TodoItemController.cs. Aggiungere l'attributo [Authorize] alla classe TodoItemController, come indicato di seguito.Add the [Authorize] attribute to the TodoItemController class, as follows. Per limitare l'accesso solo a metodi specifici, è inoltre possibile applicare questo attributo solo a tali metodi anziché alla classe.To restrict access only to specific methods, you can also apply this attribute just to those methods instead of the class. Pubblicare di nuovo il progetto server.Republish the server project.

      [Authorize]
      public class TodoItemController : TableController<TodoItem>
    
  • Back-end Node.js (tramite codice Node.js) :Node.js backend (via Node.js code) :

    Per richiedere l'autenticazione per l'accesso alla tabella, aggiungere la riga seguente allo script del server Node.js:To require authentication for table access, add the following line to the Node.js server script:

      table.access = 'authenticated';
    

    Per altre informazioni, vedere Procedura: Richiedere l'autenticazione per l'accesso alle tabelle.For more details, see How to: Require authentication for access to tables. Per informazioni su come scaricare il progetto di codice di avvio rapido dal sito, vedere Procedura: Scaricare il progetto di codice di avvio rapido del back-end Node.js tramite Git.To learn how to download the quickstart code project from your site, see How to: Download the Node.js backend quickstart code project using Git.

In Visual Studio o Xamarin Studio, eseguire il progetto client su un dispositivo o un emulatore.In Visual Studio or Xamarin Studio, run the client project on a device or emulator. Verificare che dopo l'avvio dell'app venga generata un'eccezione non gestita con codice di stato 401 (Non autorizzato).Verify that an unhandled exception with a status code of 401 (Unauthorized) is raised after the app starts. L'eccezione non gestita viene generata perché l'app prova ad accedere al back-end dell'app per dispositivi mobili come utente non autenticato.This happens because the app attempts to access your Mobile App backend as an unauthenticated user. La tabella TodoItem richiede ora l'autenticazione.The TodoItem table now requires authentication.

Si aggiornerà quindi l'app client per richiedere le risorse dal back-end dell'app per dispositivi mobili con un utente autenticato.Next, you will update the client app to request resources from the Mobile App backend with an authenticated user.

Aggiungere l'autenticazione all'appAdd authentication to the app

L'applicazione viene aggiornata per richiedere agli utenti di toccare il pulsante Accedi ed eseguire l'autenticazione prima della visualizzazione dei dati.The app is updated to require users to tap the Sign in button and authenticate before data is displayed.

  1. Aggiungere il codice seguente alla classe TodoActivity :Add the following code to the TodoActivity class:

     // Define a authenticated user.
     private MobileServiceUser user;
     private async Task<bool> Authenticate()
     {
             var success = false;
             try
             {
                 // Sign in with Facebook login using a server-managed flow.
                 user = await client.LoginAsync(this,
                     MobileServiceAuthenticationProvider.Facebook, "{url_scheme_of_your_app}");
                 CreateAndShowDialog(string.Format("you are now logged in - {0}",
                     user.UserId), "Logged in!");
    
                 success = true;
             }
             catch (Exception ex)
             {
                 CreateAndShowDialog(ex, "Authentication failed");
             }
             return success;
     }
    
     [Java.Interop.Export()]
     public async void LoginUser(View view)
     {
         // Load data only after authentication succeeds.
         if (await Authenticate())
         {
             //Hide the button after authentication succeeds.
             FindViewById<Button>(Resource.Id.buttonLoginUser).Visibility = ViewStates.Gone;
    
             // Load the data.
             OnRefreshItemsSelected();
         }
     }
    

    Verrà creato un nuovo metodo per autenticare un utente e un gestore del metodo per un nuovo pulsante Accedi .This creates a new method to authenticate a user and a method handler for a new Sign in button. Nell'esempio di codice precedente, l'utente viene autenticato tramite un account di accesso di Facebook.The user in the example code above is authenticated by using a Facebook login. Viene usata una finestra di dialogo per visualizzare l'ID utente una volta completata l'autenticazione.A dialog is used to display the user ID once authenticated.

    Nota

    Se si usa un provider di identità diverso da Google, sostituire il valore passato a LoginAsync riportato in precedenza con uno dei seguenti: MicrosoftAccount, Twitter, Google o WindowsAzureActiveDirectory.If you are using an identity provider other than Facebook, change the value passed to LoginAsync above to one of the following: MicrosoftAccount, Twitter, Google, or WindowsAzureActiveDirectory.

  2. Nel metodo OnCreate , eliminare o impostare come commento la riga di codice seguente:In the OnCreate method, delete or comment-out the following line of code:

     OnRefreshItemsSelected ();
    
  3. Nel file Activity_To_Do.axml aggiungere la definizione del pulsante LoginUser prima del pulsante AddItem esistente:In the Activity_To_Do.axml file, add the following LoginUser button definition before the existing AddItem button:

       <Button
         android:id="@+id/buttonLoginUser"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:onClick="LoginUser"
         android:text="@string/login_button_text" />
    
  4. Aggiungere l'elemento seguente al file di risorse Strings.xml:Add the following element to the Strings.xml resources file:

     <string name="login_button_text">Sign in</string>
    
  5. Aprire il file AndroidManifest.xml, aggiungere il codice seguente all'interno dell'elemento XML <application>:Open the AndroidManifest.xml file, add the following code inside <application> XML element:

     <activity android:name="com.microsoft.windowsazure.mobileservices.authentication.RedirectUrlActivity" android:launchMode="singleTop" android:noHistory="true">
       <intent-filter>
         <action android:name="android.intent.action.VIEW" />
         <category android:name="android.intent.category.DEFAULT" />
         <category android:name="android.intent.category.BROWSABLE" />
         <data android:scheme="{url_scheme_of_your_app}" android:host="easyauth.callback" />
       </intent-filter>
     </activity>
    
  6. In Visual Studio o Xamarin Studio eseguire il progetto client in un dispositivo o un emulatore ed eseguire l'accesso tramite il provider di identità scelto.In Visual Studio or Xamarin Studio, run the client project on a device or emulator and sign in with your chosen identity provider. Dopo aver eseguito l'accesso, verranno visualizzati l'ID di accesso l'elenco di elementi ToDo e sarà possibile aggiornare i dati nell'app.When you are successfully logged-in, the app will display your login ID and the list of todo items, and you can make updates to the data.