Tworzenie aplikacji platformy Xamarin.Forms na platformie Azure

  • Artykuł

Omówienie

W tym samouczku przedstawiono sposób dodawania usługi zaplecza opartej na chmurze do aplikacji mobilnej platformy Xamarin.Forms przy użyciu funkcji Mobile Apps usługi Azure App Service jako zaplecza. Tworzysz nowe zaplecze funkcji Mobile Apps oraz prostą aplikację platformy Xamarin.Forms typu Lista czynności do wykonania, która przechowuje dane aplikacji na platformie Azure.

Wykonanie czynności opisanych w tym samouczku jest wymaganiem wstępnym dla wszystkich innych samouczków usługi Mobile Apps dotyczących aplikacji platformy Xamarin.Forms.

Wymagania wstępne

Do ukończenia tego samouczka są potrzebne są następujące elementy:

  • Aktywne konto platformy Azure. Jeśli nie masz konta, możesz utworzyć konto wersji próbnej platformy Azure i uzyskać maksymalnie 10 bezpłatnych aplikacji mobilnych, z których możesz korzystać nawet po zakończeniu okresu ważności wersji próbnej. Aby uzyskać więcej informacji, zobacz Bezpłatna wersja próbna platformy Azure.

  • Visual Studio Tools for Xamarin w programie Visual Studio 2017 lub nowszym lub Visual Studio dla komputerów Mac. Instrukcje znajdują się na stronie z opisem instalacji platformy Xamarin.

  • (opcjonalnie) Aby móc tworzyć aplikacje dla systemu iOS, wymagany jest komputer Mac z programem Xcode 9.0 lub nowszym. Visual Studio dla komputerów Mac można użyć do tworzenia aplikacji systemu iOS lub programu Visual Studio 2017 lub nowszego (tak długo, jak komputer Mac jest dostępny w sieci).

Tworzenie nowego zaplecza funkcji Mobile Apps

  1. Zaloguj się w witrynie Azure Portal.

  2. Kliknij pozycję Utwórz zasób.

  3. W polu wyszukiwania wpisz Web App.

  4. Na liście wyników wybierz pozycję Aplikacja internetowa z witryny Marketplace.

  5. Wybierz subskrypcję igrupę zasobów (wybierz istniejącą grupę zasobów lub utwórz nową (używając tej samej nazwy co aplikacja)).

  6. Wybierz unikatową nazwę aplikacji internetowej.

  7. Wybierz domyślną opcję Publikuj jako Kod.

  8. W stosie Środowisko uruchomieniowe należy wybrać wersję w obszarze ASP.NET lub Node. Jeśli tworzysz zaplecze platformy .NET, wybierz wersję w obszarze ASP.NET. W przeciwnym razie, jeśli jest przeznaczona dla aplikacji opartej na węźle, wybierz jedną z wersji z węzła.

  9. Wybierz odpowiedni system operacyjny, Linux lub Windows.

  10. Wybierz region , w którym chcesz wdrożyć tę aplikację.

  11. Wybierz odpowiedni App Service plan i wybierz pozycję Przejrzyj i utwórz.

  12. W obszarze Grupa zasobów wybierz istniejącą grupę zasobów lub utwórz nową (używając tej samej nazwy, co aplikacja).

  13. Kliknij pozycję Utwórz. Zanim przejdziesz do kolejnych kroków, odczekaj kilka minut, aby usługa została wdrożona pomyślnie. Obserwuj ikonę powiadomień (dzwonek) w nagłówku portalu, pokazującą aktualizacje stanu.

  14. Po zakończeniu wdrażania kliknij sekcję Szczegóły wdrożenia , a następnie kliknij pozycję Zasób typu Microsoft.Web/sites. Spowoduje to przejście do właśnie utworzonej aplikacji internetowej App Service.

  15. Kliknij blok Konfiguracja w obszarze Ustawienia i w ustawieniach aplikacji kliknij przycisk Nowe ustawienie aplikacji .

  16. Na stronie ustawienia Dodaj/Edytuj aplikację wprowadź ciąg Nazwa jako MobileAppsManagement_EXTENSION_VERSION i Wartość jako najnowsza i naciśnij przycisk OK.

Wszystko jest ustawione na użycie tej nowo utworzonej aplikacji internetowej App Service jako aplikacji mobilnej.

Tworzenie połączenia z bazą danych i konfigurowanie projektu klienta i serwera

  1. Pobierz przewodniki Szybki start zestawu SDK klienta dla następujących platform:

    iOS (Objective-C)
    iOS (Swift)
    Android (Java)
    Xamarin.iOS
    Xamarin.Android
    Xamarin.Forms
    Cordova
    Windows (C#)

    Uwaga

    Jeśli używasz projektu systemu iOS, musisz pobrać plik "azuresdk-iOS-*.zip" z najnowszej wersji usługi GitHub. Rozpakuj MicrosoftAzureMobile.framework i dodaj plik do katalogu głównego projektu.

  2. Musisz dodać połączenie z bazą danych lub nawiązać połączenie z istniejącym połączeniem. Najpierw określ, czy utworzysz magazyn danych, czy użyjesz istniejącego magazynu danych.

    • Utwórz nowy magazyn danych: jeśli zamierzasz utworzyć magazyn danych, skorzystaj z następującego przewodnika Szybki start:

      Szybki start: wprowadzenie do pojedynczych baz danych w usłudze Azure SQL Database

    • Istniejące źródło danych: postępuj zgodnie z poniższymi instrukcjami, jeśli chcesz użyć istniejącego połączenia z bazą danych

      1. format parametrów połączenia SQL Database —Data Source=tcp:{your_SQLServer},{port};Initial Catalog={your_catalogue};User ID={your_username};Password={your_password}

        {your_SQLServer} Nazwa serwera, można go znaleźć na stronie przeglądu bazy danych i jest zwykle w postaci "server_name.database.windows.net". {port} zwykle 1433. {your_catalogue} Nazwa bazy danych. {your_username} Nazwa użytkownika w celu uzyskania dostępu do bazy danych. {your_password} Hasło dostępu do bazy danych.

        Dowiedz się więcej o formacie parametrów połączenia SQL

      2. Dodaj parametry połączenia do aplikacji mobilnej W App Service możesz zarządzać parametrami połączenia dla aplikacji przy użyciu opcji Konfiguracja w menu.

        Aby dodać parametry połączenia:

        1. Kliknij kartę Ustawienia aplikacji .

        2. Kliknij pozycję [+] Nowe parametry połączenia.

        3. Musisz podać nazwę, wartość i typ parametrów połączenia.

        4. Wpisz nazwę jako MS_TableConnectionString

        5. Wartość powinna być ciągiem łączenia utworzonym w kroku przed.

        6. W przypadku dodawania parametrów połączenia do bazy danych Usługi SQL Azure wybierz pozycję SQLAzure w obszarze typ.

  3. Usługa Azure Mobile Apps ma zestawy SDK dla platformy .NET i Node.js zapleczy.

    • zapleczeNode.js

      Jeśli zamierzasz użyć Node.js aplikacji Szybki start, postępuj zgodnie z poniższymi instrukcjami.

      1. W Azure Portal przejdź do pozycji Łatwe tabele, zobaczysz ten ekran.

        Łatwe tabele węzłów

      2. Upewnij się, że parametry połączenia SQL zostały już dodane na karcie Konfiguracja . Następnie zaznacz pole wyboru Potwierdzam, że spowoduje to zastąpienie całej zawartości witryny i kliknij przycisk Utwórz tabelę TodoItem .

        Konfiguracja łatwych tabel węzłów

      3. W obszarze Łatwe tabele kliknij przycisk + Dodaj .

        Przycisk Dodawania tabel łatwych w węźle

      4. Utwórz tabelę z dostępem TodoItem anonimowym.

        Tabele łatwe w węźle — dodawanie tabeli

    • Zaplecze .NET

      Jeśli zamierzasz korzystać z aplikacji Szybki start platformy .NET, postępuj zgodnie z poniższymi instrukcjami.

      1. Pobierz projekt serwera .NET usługi Azure Mobile Apps z repozytorium azure-mobile-apps-quickstarts.

      2. Skompiluj projekt serwera .NET lokalnie w programie Visual Studio.

      3. W programie Visual Studio otwórz Eksplorator rozwiązań, kliknij prawym przyciskiem myszy projekt, kliknij pozycję ZUMOAPPNAMEServicePublikuj, zostanie wyświetlone Publish to App Service okno. Jeśli pracujesz na komputerze Mac, zapoznaj się z innymi sposobami wdrażania aplikacji tutaj.

        Publikowanie w programie Visual Studio

      4. Wybierz pozycję App Service jako element docelowy publikowania, a następnie kliknij pozycję Wybierz istniejącą, a następnie kliknij przycisk Publikuj w dolnej części okna.

      5. Najpierw musisz zalogować się do programu Visual Studio przy użyciu subskrypcji platformy Azure. Wybierz element Subscription, Resource Group, a następnie wybierz nazwę aplikacji. Gdy wszystko będzie gotowe, kliknij przycisk OK, spowoduje to wdrożenie lokalnego projektu serwera .NET w zapleczu App Service. Po zakończeniu wdrażania nastąpi przekierowanie do http://{zumoappname}.azurewebsites.net/ witryny w przeglądarce.

Uruchamianie rozwiązania Xamarin.Forms

Do otwierania rozwiązania wymagane są narzędzia Visual Studio Tools for Xamarin. Zobacz instrukcje dotyczące instalacji platformy Xamarin. Jeśli te narzędzia zostały już zainstalowane, wykonaj następujące kroki, aby pobrać i otwórz rozwiązanie:

Visual Studio (Windows i Mac)

  1. Przejdź do Azure Portal i przejdź do utworzonej aplikacji mobilnej. Overview W bloku wyszukaj adres URL, który jest publicznym punktem końcowym aplikacji mobilnej. Przykład — nazwa witryny dla nazwy mojej aplikacji "test123" będzie mieć wartość https://test123.azurewebsites.net.

  2. Otwórz plik Constants.cs w tym folderze — xamarin.forms/ZUMOAPPNAME. Nazwa aplikacji to ZUMOAPPNAME.

  3. W Constants.cs klasie zastąp ZUMOAPPURL zmienną publicznym punktem końcowym powyżej.

    public static string ApplicationURL = @"ZUMOAPPURL";

    Staje się

    public static string ApplicationURL = @"https://test123.azurewebsites.net";

  4. Wykonaj poniższe instrukcje, aby uruchomić projekty systemu Android lub Windows, a jeśli w sieci jest dostępny komputer Mac, również projekty systemu iOS.

(Opcjonalnie) Uruchamianie projektu systemu Android

W tej sekcji uruchamiasz projekt platformy Xamarin.Android. Jeśli nie pracujesz z urządzeniami z systemem Android, możesz pominąć tę sekcję.

Visual Studio

  1. Kliknij prawym przyciskiem myszy projekt Android (Droid), a następnie wybierz pozycję Ustaw jako projekt startowy.

  2. W menu Kompilacja wybierz pozycję Configuration Manager.

  3. W oknie dialogowym Configuration Manager zaznacz pola wyboru Kompiluj i Wdróż obok projektu systemu Android oraz upewnij się, że zaznaczono pole Kompiluj obok projektu współużytkowanego kodu.

  4. Aby skompilować projekt i uruchomić aplikację w emulatorze systemu Android, naciśnij klawisz F5 lub kliknij przycisk Uruchom.

Visual Studio dla komputerów Mac

  1. Kliknij prawym przyciskiem myszy projekt Android, a następnie wybierz pozycję Ustaw jako projekt startowy.

  2. W celu skompilowania projektu i uruchomienia aplikacji w emulatorze systemu Android wybierz menu Uruchom, a następnie pozycję Rozpocznij debugowanie.

W aplikacji wpisz znaczący tekst, na przykład Poznaj program Xamarin, a wybierz znak plusa (+).

Tworzona aplikacja dla systemu Android

Ta akcja spowoduje wysłanie żądania POST do nowego zaplecza funkcji Mobile Apps, które jest hostowane na platformie Azure. Dane z żądania zostaną wstawione do tabeli czynności do wykonania. Elementy przechowywane w tabeli są zwracane przez zaplecze funkcji Mobile Apps, a dane są wyświetlane na liście.

Uwaga

Kod uzyskujący dostęp do zaplecza funkcji Mobile Apps znajduje się w pliku C# TodoItemManager.cs projektu współużytkowanego kodu w rozwiązaniu.

(Opcjonalnie) Uruchamianie projektu iOS

W tej sekcji uruchamiasz projekt Xamarin.iOS dla urządzeń z systemem iOS. Jeśli nie pracujesz z urządzeniami z systemem iOS, możesz pominąć tę sekcję.

Visual Studio

  1. Kliknij prawym przyciskiem myszy projekt iOS, a następnie wybierz pozycję Ustaw jako projekt startowy.

  2. W menu Kompilacja wybierz pozycję Configuration Manager.

  3. W oknie dialogowym Configuration Manager zaznacz pola wyboru Kompiluj i Wdróż obok projektu systemu iOS oraz upewnij się, że zaznaczono pole Kompiluj obok projektu współużytkowanego kodu.

  4. Aby skompilować projekt i uruchomić aplikację w emulatorze urządzenia iPhone, naciśnij klawisz F5.

Visual Studio dla komputerów Mac

  1. Kliknij prawym przyciskiem myszy projekt systemu iOS, a następnie wybierz polecenie Ustaw jako projekt startowy.

  2. W menu Uruchom wybierz pozycję Rozpocznij debugowanie w celu skompilowania projektu i uruchomienia aplikacji w emulatorze urządzenia iPhone.

W aplikacji wpisz znaczący tekst, na przykład Poznaj program Xamarin, a wybierz znak plusa (+).

Tworzona aplikacja dla systemu iOS

Ta akcja spowoduje wysłanie żądania POST do nowego zaplecza funkcji Mobile Apps, które jest hostowane na platformie Azure. Dane z żądania zostaną wstawione do tabeli czynności do wykonania. Elementy przechowywane w tabeli są zwracane przez zaplecze funkcji Mobile Apps, a dane są wyświetlane na liście.

Uwaga

Kod uzyskujący dostęp do zaplecza funkcji Mobile Apps można znaleźć w pliku C# TodoItemManager.cs projektu współużytkowanego kodu w rozwiązaniu.

(Opcjonalnie) Uruchamianie projektu Windows

W tej sekcji uruchomisz projekt platformy uniwersalnej systemu Windows Xamarin.Forms dla urządzeń z systemem Windows. Jeśli nie pracujesz z urządzeniami z systemem Windows, możesz pominąć tę sekcję.

Visual Studio

  1. Kliknij prawym przyciskiem myszy dowolny projekt platformy uniwersalnej systemu Windows, a następnie wybierz pozycję Ustaw jako projekt startowy.

  2. W menu Kompilacja wybierz pozycję Configuration Manager.

  3. W oknie dialogowym Configuration Manager zaznacz pola wyboru Kompiluj i Wdróż obok wybranego projektu systemu Windows oraz upewnij się, że zaznaczono pole Kompiluj obok projektu współużytkowanego kodu.

  4. Aby skompilować projekt i uruchomić aplikację w emulatorze systemu Windows, naciśnij klawisz F5 lub kliknij przycisk Uruchom (z napisem Komputer lokalny).

Uwaga

Projektów dla systemu Windows nie można uruchamiać w systemie macOS.

W aplikacji wpisz znaczący tekst, na przykład Poznaj program Xamarin, a wybierz znak plusa (+).

Ta akcja spowoduje wysłanie żądania POST do nowego zaplecza funkcji Mobile Apps, które jest hostowane na platformie Azure. Dane z żądania zostaną wstawione do tabeli czynności do wykonania. Elementy przechowywane w tabeli są zwracane przez zaplecze funkcji Mobile Apps, a dane są wyświetlane na liście.

Tworzona aplikacja dla platformy uniwersalnej systemu Windows

Uwaga

Kod, który uzyskuje dostęp do zaplecza usługi Mobile Apps, znajduje się w pliku C# TodoItemManager.cs projektu biblioteki klas przenośnych rozwiązania.

Rozwiązywanie problemów

Jeśli masz problemy z kompilowaniem rozwiązania, uruchom menedżera pakietów NuGet i przeprowadź aktualizację rozszerzenia Xamarin.Forms do najnowszej wersji, a w projekcie systemu Android zaktualizuj pakiety obsługi rozszerzenia Xamarin.Android. Projekty typu Szybki start nie zawsze zawierają najnowsze wersje.

Pamiętaj, że wszystkie pakiety dla pomocy technicznej, do których odwołuje się projekt systemu Android, muszą mieć tę samą wersję. Pakiet NuGet usługi Azure Mobile Apps ma zależność Xamarin.Android.Support.CustomTabs dla platformy Android, więc jeśli projekt używa nowszych pakietów dla pomocy technicznej, musisz bezpośrednio zainstalować ten pakiet w wymaganej wersji w celu uniknięcia konfliktów.