Sdílet prostřednictvím


Přidání ověřování do aplikace Xamarin Forms

Přehled

V tomto tématu se dozvíte, jak ověřovat uživatele mobilní aplikace App Service z klientské aplikace. V tomto kurzu přidáte ověřování do projektu rychlého startu Xamarin Forms pomocí zprostředkovatele identity podporovaného službou App Service. Po úspěšném ověření a autorizaci vaší mobilní aplikací se zobrazí hodnota ID uživatele a budete mít přístup k datům tabulky s omezeným přístupem.

Požadavky

Pro nejlepší výsledek v tomto kurzu doporučujeme nejprve dokončit kurz vytvoření aplikace Xamarin Forms . Po dokončení tohoto kurzu budete mít projekt Xamarin Forms, který je multiformní aplikací TodoList.

Pokud stažený projekt serveru Rychlý start nepoužíváte, musíte do projektu přidat balíček rozšíření ověřování. Další informace o balíčcích rozšíření serveru najdete v tématu Práce se sadou SDK back-endového serveru .NET pro azure Mobile Apps.

Registrace aplikace pro ověřování a konfigurace App Services

Nejprve je potřeba zaregistrovat aplikaci na webu zprostředkovatele identity a pak v back-endu Mobile Apps nastavit přihlašovací údaje vygenerované zprostředkovatelem.

  1. Nakonfigurujte svého upřednostňovaného poskytovatele identity podle pokynů specifických pro poskytovatele:

  2. Opakujte předchozí kroky pro každého poskytovatele, kterého chcete ve své aplikaci podporovat.

Přidání aplikace do povolených adres URL pro externí přesměrování

Zabezpečené ověřování vyžaduje, abyste definovali nové schéma adres URL pro vaši aplikaci. Systém ověření tak může po dokončení ověřovacího procesu přesměrovat zpět k vaší aplikaci. V tomto kurzu používáme schéma adresy URL appname v celém textu. Můžete ale použít libovolné schéma adres URL, které zvolíte. Měla by být jedinečná pro vaši mobilní aplikaci. Povolení přesměrování na straně serveru:

  1. Na webu Azure Portal vyberte svou službu App Service.

  2. Klikněte na možnost Ověřování / Autorizace.

  3. Do povolených adres URL externího přesměrování zadejte url_scheme_of_your_app://easyauth.callback. Url_scheme_of_your_app v tomto řetězci je schéma adres URL pro vaši mobilní aplikaci. Měl by dodržovat normální specifikaci adresy URL pro protokol (používejte jenom písmena a číslice a začněte písmenem). Měli byste si poznamenat řetězec, který zvolíte, protože budete muset upravit kód mobilní aplikace pomocí schématu adresy URL na několika místech.

  4. Klikněte na OK.

  5. Klikněte na Uložit.

Omezení oprávnění pro ověřené uživatele

Ve výchozím nastavení je možné rozhraní API v back-endu Mobile Apps vyvolat anonymně. Dále je potřeba omezit přístup jenom na ověřené klienty.

  • Backend Node.js (prostřednictvím portálu Azure):

    V nastavení Mobile Apps klikněte na Snadné tabulky a vyberte tabulku. Klepněte na tlačítko Změnit oprávnění, vyberte Ověřený přístup pouze pro všechna oprávnění a potom klepněte na tlačítko Uložit.

  • .NET backend (C#):

    V projektu serveru přejděte na Kontrolery>TodoItemController.cs. Přidejte atribut [Authorize] do třídy TodoItemController následujícím způsobem. Chcete-li omezit přístup pouze na konkrétní metody, můžete tento atribut použít pouze u těchto metod místo třídy. Znovu publikujte projekt serveru.

      [Authorize]
      public class TodoItemController : TableController<TodoItem>
    
  • Node.js zázemí (prostřednictvím Node.js kódu):

    Pokud chcete vyžadovat ověřování pro přístup k tabulce, přidejte do skriptu serveru Node.js následující řádek:

      table.access = 'authenticated';
    

    Další podrobnosti najdete v tématu Postupy: Vyžadování ověřování pro přístup k tabulkám. Informace o tom, jak stáhnout projekt kódu pro rychlý start z webu, můžete najít v tématu Postupy: Stažení projektu kódu rychlého startu Node.js backendu pomocí Gitu.

Přidání autentizace do přenosné knihovny tříd

Mobile Apps používá metodu rozšíření LoginAsync v MobileServiceClient k přihlášení uživatele pomocí ověřování pomocí služby App Service. Tato ukázka používá tok ověřování spravovaného serverem, který zobrazuje přihlašovací rozhraní poskytovatele v aplikaci. Další informace najdete v tématu Ověřování spravované serverem. Pokud chcete zajistit lepší uživatelské prostředí v produkční aplikaci, měli byste zvážit místo toho použití ověřování spravovaného klientem.

Pokud se chcete ověřit pomocí projektu Xamarin Forms, definujte rozhraní IAuthenticate v přenosné knihovně tříd pro aplikaci. Potom přidejte tlačítko pro přihlášení do uživatelského rozhraní definovaného v knihovně přenosných tříd, na které kliknete a spustíte ověřování. Po úspěšném ověření se data načtou z back-endu mobilní aplikace.

Implementujte rozhraní IAuthenticate pro každou platformu podporovanou vaší aplikací.

  1. Ve Visual Studiu nebo Xamarin Studiu otevřete App.cs z projektu, který má v názvu Portable, což je projekt typu Portable Class Library, a pak přidejte následující using příkaz:

     ```csharp
     using System.Threading.Tasks;
     ```
    
  2. V App.cs přidejte následující IAuthenticate definici rozhraní bezprostředně před definici App třídy.

     ```csharp
     public interface IAuthenticate
     {
         Task<bool> Authenticate();
     }
     ```
    
  3. Pokud chcete inicializovat rozhraní s implementací specifickou pro platformu, přidejte do třídy App následující statické členy.

     ```csharp
     public static IAuthenticate Authenticator { get; private set; }
    
     public static void Init(IAuthenticate authenticator)
     {
         Authenticator = authenticator;
     }
     ```
    
  4. Otevřete TodoList.xaml z projektu Portable Class Library, přidejte následující prvek Button do rozložení buttonsPanel po existujícím tlačítku.

     ```xml
       <Button x:Name="loginButton" Text="Sign-in" MinimumHeightRequest="30"
         Clicked="loginButton_Clicked"/>
     ```
    

    Toto tlačítko aktivuje ověřování spravované serverem pomocí back-endu mobilní aplikace.

  5. Otevřete TodoList.xaml.cs z projektu Knihovny přenosných tříd a přidejte do TodoList třídy následující pole:

     ```csharp
     // Track whether the user has authenticated.
     bool authenticated = false;
     ```
    
  6. Nahraďte metodu OnAppearing následujícím kódem:

     ```csharp
     protected override async void OnAppearing()
     {
         base.OnAppearing();
    
         // Refresh items only when authenticated.
         if (authenticated == true)
         {
             // Set syncItems to true in order to synchronize the data
             // on startup when running in offline mode.
             await RefreshItems(true, syncItems: false);
    
             // Hide the Sign-in button.
             this.loginButton.IsVisible = false;
         }
     }
     ```
    

    Tento kód zajistí, že se data aktualizují jenom ze služby po ověření.

  7. Do třídy TodoList přidejte následující obslužnou rutinu události Clicked:

     ```csharp
     async void loginButton_Clicked(object sender, EventArgs e)
     {
         if (App.Authenticator != null)
             authenticated = await App.Authenticator.Authenticate();
    
         // Set syncItems to true to synchronize the data on startup when offline is enabled.
         if (authenticated == true)
             await RefreshItems(true, syncItems: false);
     }
     ```
    
  8. Uložte změny, znovu sestavte projekt Knihovny tříd pro více platforem a ověřte, že nejsou žádné chyby.

Přidání ověřování do aplikace pro Android

Tato část ukazuje, jak implementovat rozhraní IAuthenticate v projektu aplikace pro Android. Pokud nepodporujete zařízení s Androidem, tuto část přeskočte.

  1. V sadě Visual Studio nebo Xamarin Studio klikněte pravým tlačítkem myši na projekt droid a pak nastavte jako spouštěcí projekt.

  2. Stisknutím klávesy F5 spusťte projekt v ladicím programu a potom ověřte, že se po spuštění aplikace vyvolá neošetřená výjimka se stavovým kódem 401 (Neautorizováno). Kód 401 se vytvoří, protože přístup k back-endu je omezený jenom na oprávněné uživatele.

  3. Otevřete MainActivity.cs v projektu Android a přidejte následující using příkazy:

     ```csharp
     using Microsoft.WindowsAzure.MobileServices;
     using System.Threading.Tasks;
     ```
    
  4. Aktualizujte třídu MainActivity tak, aby implementovaly rozhraní IAuthenticate následujícím způsobem:

     ```csharp
     public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsApplicationActivity, IAuthenticate
     ```
    
  5. Aktualizujte třídu MainActivity přidáním pole MobileServiceUser a metody Authenticate , která je vyžadována rozhraním IAuthenticate následujícím způsobem:

     ```csharp
     // Define an authenticated user.
     private MobileServiceUser user;
    
     public async Task<bool> Authenticate()
     {
         var success = false;
         var message = string.Empty;
         try
         {
             // Sign in with Facebook login using a server-managed flow.
             user = await TodoItemManager.DefaultManager.CurrentClient.LoginAsync(this, 
                 MobileServiceAuthenticationProvider.Facebook, "{url_scheme_of_your_app}");
             if (user != null)
             {
                 message = string.Format("you are now signed-in as {0}.",
                     user.UserId);
                 success = true;
             }
         }
         catch (Exception ex)
         {
             message = ex.Message;
         }
    
         // Display the success or failure message.
         AlertDialog.Builder builder = new AlertDialog.Builder(this);
         builder.SetMessage(message);
         builder.SetTitle("Sign-in result");
         builder.Create().Show();
    
         return success;
     }
    
     public override void OnResume()
     {
         base.OnResume();
         Xamarin.Essentials.Platform.OnResume();
     }
     ```
    

    Pokud používáte jiného zprostředkovatele identity než Facebook, zvolte pro MobileServiceAuthenticationProvider jinou hodnotu.

  6. Aktualizujte soubor AndroidManifest.xml přidáním následujícího kódu XML do elementu <application> :

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

    Nahraďte {url_scheme_of_your_app} schématem adres URL.

  7. Před voláním LoadApplication()do metody OnCreate třídy MainActivity přidejte následující kód:

     ```csharp
     // Initialize the authenticator before loading the app.
     App.Init((IAuthenticate)this);
     ```
    

    Tento kód zajistí, že se ověřovací objekt inicializuje před načtením aplikace.

  8. Znovu sestavte aplikaci, spusťte ji a pak se přihlaste pomocí zprostředkovatele ověřování, který jste zvolili, a ověřte, že máte přístup k datům jako ověřený uživatel.

Řešení problémů

Aplikace se chybově ukončila Java.Lang.NoSuchMethodError: No static method startActivity

V některých případech se konflikty v balíčcích podpory zobrazují pouze jako upozornění v sadě Visual Studio, ale aplikace spadne s touto výjimkou při běhu programu. V takovém případě se musíte ujistit, že všechny balíčky podpory odkazované v projektu mají stejnou verzi. Balíček NuGet Azure Mobile AppsXamarin.Android.Support.CustomTabs závislost pro platformu Android, takže pokud váš projekt používá novější balíčky podpory, musíte tento balíček nainstalovat s požadovanou verzí přímo, aby nedocházelo ke konfliktům.

Přidání ověřování do aplikace pro iOS

Tato část ukazuje, jak implementovat rozhraní IAuthenticate v projektu aplikace pro iOS. Tuto část přeskočte, pokud nepodporujete zařízení s iOSem.

  1. V sadě Visual Studio nebo Xamarin Studio klikněte pravým tlačítkem myši na projekt iOS a pak Nastavit jako startovací projekt.

  2. Stisknutím klávesy F5 spusťte projekt v ladicím programu a potom ověřte, že se po spuštění aplikace vyvolá neošetřená výjimka se stavovým kódem 401 (Neautorizováno). Odpověď 401 se vytvoří, protože přístup k back-endu je omezen pouze na oprávněné uživatele.

  3. Otevřete AppDelegate.cs v projektu iOS a přidejte následující using příkazy:

     ```csharp
     using Microsoft.WindowsAzure.MobileServices;
     using System.Threading.Tasks;
     ```
    
  4. Aktualizujte třídu AppDelegate tak, aby implementovala rozhraní IAuthenticate následujícím způsobem:

     ```csharp
     public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate, IAuthenticate
     ```
    
  5. Aktualizujte třídu AppDelegate přidáním pole MobileServiceUser a metody Authenticate , která je vyžadována rozhraním IAuthenticate následujícím způsobem:

     ```csharp
     // Define an authenticated user.
     private MobileServiceUser user;
    
     public async Task<bool> Authenticate()
     {
         var success = false;
         var message = string.Empty;
         try
         {
             // Sign in with Facebook login using a server-managed flow.
             if (user == null)
             {
                 user = await TodoItemManager.DefaultManager.CurrentClient
                     .LoginAsync(UIApplication.SharedApplication.KeyWindow.RootViewController,
                     MobileServiceAuthenticationProvider.Facebook, "{url_scheme_of_your_app}");
                 if (user != null)
                 {
                     message = string.Format("You are now signed-in as {0}.", user.UserId);
                     success = true;
                 }
             }
         }
         catch (Exception ex)
         {
            message = ex.Message;
         }
    
         // Display the success or failure message.
         UIAlertController avAlert = UIAlertController.Create("Sign-in result", message, UIAlertControllerStyle.Alert);
         avAlert.AddAction(UIAlertAction.Create("OK", UIAlertActionStyle.Default, null));
         UIApplication.SharedApplication.KeyWindow.RootViewController.PresentViewController(avAlert, true, null);
    
         return success;
     }
     ```
    

    Pokud používáte jiného zprostředkovatele identity než Facebook, zvolte jinou hodnotu pro [MobileServiceAuthenticationProvider].

  6. Aktualizujte třídu AppDelegate přidáním přetížení metody OpenUrl následujícím způsobem:

     ```csharp
     public override bool OpenUrl(UIApplication app, NSUrl url, NSDictionary options)
     {
         if (TodoItemManager.DefaultManager.CurrentClient.ResumeWithURL(app, url, options))
             return true;
         return base.OpenUrl(app, url, options);
     }
     ```
    
  7. Před voláním LoadApplication()přidejte následující řádek kódu do metody FinishedLaunching:

     ```csharp
     App.Init(this);
     ```
    

    Tento kód zajistí, že se ověřovací objekt inicializuje před načtením aplikace.

  8. Otevřete Soubor Info.plist a přidejte typ adresy URL. Nastavte identifikátor na název podle vašeho výběru, schémata adres URL schématu adresy URL pro vaši aplikaci a roli na Žádné.

  9. Znovu sestavte aplikaci, spusťte ji a pak se přihlaste pomocí zprostředkovatele ověřování, který jste zvolili, a ověřte, že máte přístup k datům jako ověřený uživatel.

Přidání ověřování do projektů aplikací pro Windows 10 (včetně telefonu)

Tato část ukazuje, jak implementovat rozhraní IAuthenticate v projektech aplikací pro Windows 10. Stejný postup platí pro projekty Univerzální platformy Windows (UPW), ale použití projektu UPW (se známými změnami). Pokud nepodporujete zařízení s Windows, tuto část přeskočte.

  1. V sadě Visual Studio klikněte pravým tlačítkem myši na projekt UPW a pak nastavte jako počáteční projekt.

  2. Stisknutím klávesy F5 spusťte projekt v ladicím programu a potom ověřte, že se po spuštění aplikace vyvolá neošetřená výjimka se stavovým kódem 401 (Neautorizováno). K odpovědi 401 dochází, protože přístup k back-endu je omezen pouze na oprávněné uživatele.

  3. Otevřete MainPage.xaml.cs projektu aplikace pro Windows a přidejte následující using příkazy:

     ```csharp
     using Microsoft.WindowsAzure.MobileServices;
     using System.Threading.Tasks;
     using Windows.UI.Popups;
     using <your_Portable_Class_Library_namespace>;
     ```
    

    Nahraďte <your_Portable_Class_Library_namespace> oborem názvů pro vaši přenosnou knihovnu tříd.

  4. Aktualizujte třídu MainPage tak, aby implementovali rozhraní IAuthenticate následujícím způsobem:

     public sealed partial class MainPage : IAuthenticate
    
  5. Aktualizujte třídu MainPage přidáním pole MobileServiceUser a metody Authenticate , která je vyžadována rozhraním IAuthenticate následujícím způsobem:

     ```csharp
     // Define an authenticated user.
     private MobileServiceUser user;
    
     public async Task<bool> Authenticate()
     {
         string message = string.Empty;
         var success = false;
    
         try
         {
             // Sign in with Facebook login using a server-managed flow.
             if (user == null)
             {
                 user = await TodoItemManager.DefaultManager.CurrentClient
                     .LoginAsync(MobileServiceAuthenticationProvider.Facebook, "{url_scheme_of_your_app}");
                 if (user != null)
                 {
                     success = true;
                     message = string.Format("You are now signed-in as {0}.", user.UserId);
                 }
             }
    
         }
         catch (Exception ex)
         {
             message = string.Format("Authentication Failed: {0}", ex.Message);
         }
    
         // Display the success or failure message.
         await new MessageDialog(message, "Sign-in result").ShowAsync();
    
         return success;
     }
     ```
    

    Pokud používáte jiného zprostředkovatele identity než Facebook, zvolte pro MobileServiceAuthenticationProvider jinou hodnotu.

  6. Před voláním LoadApplication()do konstruktoru třídy MainPage přidejte následující řádek kódu:

     ```csharp
     // Initialize the authenticator before loading the app.
     <your_Portable_Class_Library_namespace>.App.Init(this);
     ```
    

    Nahraďte <your_Portable_Class_Library_namespace> oborem názvů pro vaši přenosnou knihovnu tříd.

  7. Pokud používáte UWP, přidejte následující přepsání metody OnActivated do třídy App:

     ```csharp
     protected override void OnActivated(IActivatedEventArgs args)
     {
        base.OnActivated(args);
    
         if (args.Kind == ActivationKind.Protocol)
         {
             ProtocolActivatedEventArgs protocolArgs = args as ProtocolActivatedEventArgs;
             MobileServiceClientExtensions.ResumeWithURL(TodoItemManager.DefaultManager.CurrentClient,protocolArgs.Uri);
         }
     }
     ```
    
  8. Otevřete Package.appxmanifest a přidejte deklaraci protokolu . Nastavte zobrazovaný název na název podle vašeho výběru a název nastavte na schéma adres URL pro vaši aplikaci.

  9. Znovu sestavte aplikaci, spusťte ji a pak se přihlaste pomocí zprostředkovatele ověřování, který jste zvolili, a ověřte, že máte přístup k datům jako ověřený uživatel.

Další kroky

Teď, když jste dokončili tento základní kurz ověřování, zvažte pokračování v některém z následujících kurzů:

  • Přidejte push notifikace do své aplikace

    Zjistěte, jak do aplikace přidat podporu nabízených oznámení a nakonfigurovat back-end mobilní aplikace tak, aby používal Službu Azure Notification Hubs k odesílání nabízených oznámení.

  • Povolení offline synchronizace pro vaši aplikaci

    Zjistěte, jak přidat offline podporu aplikace pomocí back-endu mobilní aplikace. Offline synchronizace umožňuje koncovým uživatelům pracovat s mobilní aplikací – prohlížením, přidáváním nebo úpravou dat – i když připojení k síti neexistuje.