Tworzenie aplikacji systemu Windows z zapleczem na platformie Azure

Omówienie

W tym samouczku przedstawiono sposób dodawania usługi zaplecza opartej na chmurze do aplikacji platformy uniwersalnej systemu Windows. Aby uzyskać więcej informacji, zobacz artykuł Co to jest usługa Mobile Apps. Poniżej przedstawiono ekrany przechwycone z ukończonej aplikacji:

Ukończona aplikacja klasyczna

Wykonanie czynności opisanych w tym samouczku jest wymaganiem wstępnym dla wszystkich innych samouczków Aplikacji mobilnych dotyczących aplikacji platformy uniwersalnej systemu Windows.

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ć szczegółowe informacje, zobacz Bezpłatna wersja próbna platformy Azure.
  • Windows 10.
  • Visual Studio Community 2017 r.
  • Wiedza dotycząca opracowywania aplikacji platformy UWP. Odwiedź stronę dokumentacji platformy UWP, aby dowiedzieć się, jak skonfigurować środowisko tworzenia aplikacji platformy UWP.

Tworzenie zaplecza nowej Aplikacji mobilnej Azure

Wykonaj te kroki, aby utworzyć zaplecze nowej Aplikacji mobilnej.

  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ą (przy użyciu tej samej nazwy co aplikacja)).

  6. Wybierz unikatową nazwę aplikacji internetowej.

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

  8. W stosie środowiska uruchomieniowego 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 aplikacja oparta na węźle jest przeznaczona, 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 plan App Service 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 , a następnie w obszarze Ustawienia aplikacji kliknij przycisk Nowe ustawienie aplikacji .

  16. Na stronie ustawienia Dodaj/Edytuj aplikację wprowadź nazwęjako MobileAppsManagement_EXTENSION_VERSION i Wartość jako najnowszą i naciśnij przycisk OK.

Wszystko jest gotowe do używania 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 dotyczące 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 zwykle ma postać "server_name.database.windows.net". {port} zwykle 1433. {your_catalogue} Nazwa bazy danych. {your_username} Nazwa użytkownika, aby uzyskać dostęp do bazy danych. {your_password} Hasło umożliwiające uzyskanie 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ć parametry połączenia : Nazwa, Wartość i Typ .

        4. Wpisz nazwę jako MS_TableConnectionString

        5. Wartość powinna być ciągiem połą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żywać Node.js aplikacji Szybki start, postępuj zgodnie z poniższymi instrukcjami.

      1. W Azure Portal przejdź do pozycji Łatwe tabele. Zostanie wyświetlony 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 łatwych tabel węzłów

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

        Node Easy Tables Add Table

    • Zaplecze .NET

      Jeśli zamierzasz używać 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 ZUMOAPPNAMEService projekt, kliknij polecenie Publikuj. 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 obiekt 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 pozycję 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 projektu klienta

  1. Otwórz projekt platformy UWP.

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

  3. Otwórz plik App.xaml.cs w tym folderze — windows-uwp-cs/ZUMOAPPNAME/. Nazwa aplikacji to ZUMOAPPNAME.

  4. W App klasie zastąp ZUMOAPPURL parametr publicznym punktem końcowym powyżej.

    public static MobileServiceClient MobileService = new MobileServiceClient("ZUMOAPPURL");

    Staje się

    public static MobileServiceClient MobileService = new MobileServiceClient("https://test123.azurewebsites.net");

  5. Naciśnij klawisz F5, aby wdrożyć i uruchomić aplikację.

  6. W aplikacji wpisz znaczący tekst, na przykład Ukończ samouczek w polu tekstowym Wstaw czynność do wykonania, a następnie kliknij pozycję Zapisz.

    Kompletna aplikacja systemu Windows typu Szybki start na komputerze

    Spowoduje to wysłanie żądania POST do zaplecza nowej aplikacji mobilnej, która jest obsługiwana na platformie Azure.