Azure Mobile Apps ile Xamarin.iOS uygulaması oluşturma

  • Makale

Bu öğreticide, Xamarin.iOS ve Azure mobil uygulamaları arka ucu kullanarak iOS mobil uygulamasına bulut tabanlı arka uç hizmeti ekleme adımları gösterilmektedir. Hem yeni bir mobil uygulama arka ucu hem de Azure'da uygulama verilerini depolayan basit bir Yapılacaklar listesi uygulaması oluşturacaksınız.

Azure Uygulaması Hizmeti'ndeki Mobile Apps özelliğini kullanarak diğer Xamarin.iOS öğreticilerinden önce bu öğreticiyi tamamlamanız gerekir.

Önkoşullar

Bu öğreticiyi tamamlamak için aşağıdakiler gerekir:

  • Aşağıdaki iş yükleriyle Visual Studio 2022 .
    • ASP.NET ve web geliştirme
    • Azure geliştirme
    • .NET ile mobil Geliştirme
  • Bir Azure hesabı.
  • Azure CLI.
    • az login Ile oturum açın ve başlamadan önce uygun bir abonelik seçin.
  • (İsteğe bağlı) Azure Geliştirici CLI'sı.
  • Kullanılabilir bir Mac:
    • XCode'u yükleme
    • Xcode'u yükledikten sonra açın; böylece ek gerekli bileşenler ekleyebilir.
    • Açıldıktan sonra XCode Tercihleri... seçeneğini belirleyin .>Bileşenler ve bir iOS simülatörü yükleyin.
    • Mac ile Eşleştirme kılavuzunu izleyin.

iOS sürümünü derlemek için bir mac gereklidir.

Örnek uygulamayı indirme

  1. Tarayıcınızda azure-mobile-apps deposunu açın.

  2. Kod açılan listesini açın ve zip'i İndir'i seçin.

    Screenshot of the Code menu on GitHub.

  3. İndirme işlemi tamamlandıktan sonra İndirmeler klasörünüzü açın ve dosyayı bulunazure-mobile-apps-main.zip.

  4. İndirilen dosyaya sağ tıklayın ve Tümünü Ayıkla... öğesini seçin.

    İsterseniz, arşivi genişletmek için PowerShell'i kullanabilirsiniz:

    C:\Temp> Expand-Archive azure-mobile-apps-main.zip

Örnekler, ayıklanan dosyaların içindeki samples klasöründe bulunur. Hızlı başlangıç örneği olarak adlandırılır TodoApp. Dosyayı çift tıklatarak örneği Visual Studio'da TodoApp.sln açabilirsiniz.

Screenshot of the file explorer for the solution.

Arka ucu Azure'a dağıtma

Not

Arka ucu zaten başka bir hızlı başlangıçtan dağıttıysanız, aynı arka ucu kullanabilir ve bu adımı atlayabilirsiniz.

Arka uç hizmetini dağıtmak için şunları yapacağız:

  • Azure'a bir Azure Uygulaması Hizmeti ve Azure SQL Veritabanı sağlama.
  • Hizmet kodunu yeni oluşturulan Azure Uygulaması Hizmetine dağıtmak için Visual Studio'yu kullanın.

Tüm adımları tamamlamak için Azure Geliştirici CLI'sini kullanma

TodoApp örneği, Azure Geliştirici CLI'sını destekleyecek şekilde yapılandırılmıştır. Tüm adımları (sağlama ve dağıtma) tamamlamak için:

  1. Azure Geliştirici CLI'sını yükleyin.
  2. Bir terminal açın ve dizini dosyayı içeren klasörle TodoApp.sln değiştirin. Bu dizin de içerir azure.yaml.
  3. azd up'i çalıştırın.

Azure'da henüz oturum açmadıysanız tarayıcı, oturum açmanızı istemek için başlatılır. Daha sonra kullanmak üzere bir abonelik ve Azure bölgesi istenir. Ardından Azure Geliştirici CLI'si gerekli kaynakları sağlar ve hizmet kodunu seçtiğiniz Azure bölgesine ve aboneliğine dağıtır. Son olarak, Azure Geliştirici CLI'sı sizin için uygun Constants.cs bir dosya yazar.

Veritabanına doğrudan erişmek istediğinizde SQL kimlik doğrulama bilgilerini görmek için komutunu çalıştırabilirsiniz azd env get-values .

Azure Geliştirici CLI ile adımları tamamladıysanız sonraki adıma geçin. Azure Geliştirici CLI'sini kullanmak istemiyorsanız, el ile uygulanan adımlarla devam edin.

Azure'da kaynak oluşturma.

  1. Bir terminal açın ve dizini dosyayı içeren klasörle TodoApp.sln değiştirin. Bu dizin de içerir azuredeploy.json.

  2. Azure CLI kullanarak oturum açtığınızdan ve bir abonelik seçtiğinizden emin olun.

  3. Yeni bir kaynak grubu oluşturun:

    az group create -l westus -g quickstart

    Bu komut, Batı ABD bölgesinde kaynak grubunu oluşturur quickstart . İstediğiniz bölgeyi seçerek orada kaynak oluşturabilirsiniz. Bu öğreticide bahsedilen her yerde aynı adı ve bölgeyi kullandığınızdan emin olun.

  4. Grup dağıtımı kullanarak kaynakları oluşturun:

    az deployment group create -g quickstart --template-file azuredeploy.json --parameters sqlPassword=MyPassword1234

    SQL Yönetici istrator parolanız için güçlü bir parola seçin. Daha sonra veritabanına erişirken ihtiyacınız olacak.

  5. Dağıtım tamamlandıktan sonra çıkış değişkenlerini alın, bunlar daha sonra ihtiyacınız olan önemli bilgileri barındırır:

    az deployment group show -g quickstart -n azuredeploy --query properties.outputs

    Örnek çıkış:

    Screenshot of command line results.

  6. Çıkışlardaki değerlerin her birini daha sonra kullanmak üzere not edin.

Hizmet kodunu yayımlama

TodoApp.sln dosyasını Visual Studio'da açın.

  1. Sağ bölmede Çözüm Gezgini'ni seçin.

  2. Projeye sağ tıklayın TodoAppService.NET6 ve Başlangıç Projesi Olarak Ayarla'yı seçin.

  3. Üstteki menüde Derleme>Yayımla TodoAppService.NET6'yı seçin.

  4. Yayımla penceresinde Hedef: Azure'ı seçin ve İleri'ye basın.

    Screenshot of the target selection window.

  5. Belirli hedef: hizmet (Windows) Azure Uygulaması'ı seçin ve İleri'ye basın.

    Screenshot of the specific target selection window.

  6. Gerekirse oturum açın ve uygun bir Abonelik adı seçin.

  7. Görünüm'un Kaynak grubu olarak ayarlandığından emin olun.

  8. quickstart Kaynak grubunu genişletin, ardından daha önce oluşturulan App Service'i seçin.

    Screenshot of the app service selection window.

  9. Bitir'i seçin.

  10. Yayımlama profili oluşturma işlemi tamamlandıktan sonra Kapat'ı seçin.

  11. Hizmet Bağımlılıkları'nı bulun ve SQL Server Veritabanı'nın yanındaki üç noktayı seçin ve ardından Bağlan'ı seçin.

    Screenshot showing the S Q L server configuration selection.

  12. Azure SQL Veritabanı'ı ve ardından İleri'yi seçin.

  13. Hızlı başlangıç veritabanını ve ardından İleri'yi seçin.

    Screenshot of the database selection window.

  14. Dağıtımın çıktılarında yer alan SQL kullanıcı adı ve parolasını kullanarak formu doldurun ve İleri'yi seçin.

    Screenshot of the database settings window.

  15. Bitir'i seçin.

  16. Tamamlandığında Kapat'ı seçin.

  17. Uygulamanızı daha önce oluşturduğunuz Azure Uygulaması Hizmeti'ne yayımlamak için Yayımla'yı seçin.

    Screenshot showing the publish button.

  18. Arka uç hizmeti yayımlandıktan sonra bir tarayıcı açılır. URL'ye ekleyin /tables/todoitem?ZUMO-API-VERSION=3.0.0 :

    Screenshot showing the browser output after the service is published.

Örnek uygulamayı yapılandırma

İstemci uygulamanızın onunla iletişim kurabilmesi için arka ucunuzun temel URL'sini bilmesi gerekir.

Hizmeti sağlamak ve dağıtmak için kullandıysanız azd up dosya Constants.cs sizin için oluşturulmuştur ve bu adımı atlayabilirsiniz.

  1. TodoApp.Data Projeyi genişletin.

  2. Projeye sağ tıklayınTodoApp.Data, ardından Sınıf Ekle...'yi>seçin.

  3. Ad olarak girin Constants.cs ve Ekle'yi seçin.

    Screenshot of adding the Constants.cs file to the project.

  4. Constants.cs.example Dosyayı açın ve içeriği kopyalayın (Ctrl-A ve ardından Ctrl-C).

  5. öğesine Constants.csgeçin, tüm metni vurgulayın (Ctrl-A) ve ardından örnek dosyadaki içeriği yapıştırın (Ctrl-V).

  6. değerini https://APPSERVICENAME.azurewebsites.net hizmetinizin arka uç URL'si ile değiştirin.

    namespace TodoApp.Data
{
    public static class Constants
    {
        /// <summary>
        /// The base URI for the Datasync service.
        /// </summary>
        public static string ServiceUri = "https://demo-datasync-quickstart.azurewebsites.net";
    }
}

    Yayımla sekmesinden hizmetinizin arka uç URL'sini alabilirsiniz. Https URL'si kullandığınızdan emin olun.

  7. Dosyayı kaydedin. (Ctrl-S).

Uygulamayı derleyin ve çalıştırın

  1. Çözüm gezgininde klasörü genişletin xamarin-native .

  2. Projeye sağ tıklayın TodoApp.iOS ve Başlangıç Projesi Olarak Ayarla'yı seçin.

  3. Üst çubukta i Telefon Simulator yapılandırması'nı ve TodoApp.iOS hedefini seçin:

    Screenshot showing how to set the run configuration for a Xamarin for i O S app.

  4. Uygun bir i Telefon simülatörü seçin (iOS 15.5 çalıştıran bir i Telefon SE seçtim).

  5. Projeyi derlemek ve çalıştırmak için F5 tuşuna basın.

Uygulama başlatıldıktan sonra öykünücüye öğe eklemek için boş bir liste ve metin kutusu görürsünüz. Şunları yapabilirsiniz:

  • + Öğe eklemek için düğmeye basın.
  • Tamamlanmış bayrağı ayarlamak veya temizlemek için bir öğe seçin.
  • Hizmetten verileri yeniden yüklemek için yenileme simgesine basın.

Screenshot of the running i O S app showing the to do list.

Sorun giderme

Visual Studio 2022 ile birlikte gelen uzak simülatör XCode 13.3 ile uyumsuz. Aşağıdaki hata iletisini alırsınız:

Screenshot of the error message when launching the i O S simulator.

Bu soruna geçici bir çözüm olarak:

  • Uzak simülatörü devre dışı bırakın (Araçlar / Seçenekler / iOS Ayarlar / Windows için Uzak Simülatör seçeneğinin işaretini kaldırın). İşareti kaldırıldığında simülatör Windows yerine Mac'te çalışır. Daha sonra Windows'da hata ayıklayıcısını vb. kullanırken doğrudan Mac'inizde simülatörle etkileşim kurabilirsiniz.
  • Yukarıdaki gibi uzak simülatörü devre dışı bırakın, böylece simülatör Mac'te çalışır. Ardından, Windows'tan Mac masaüstüne bağlanmak için bir uzak masaüstü uygulaması kullanın. Uzak masaüstü seçenekleri Arasında Devolutions Uzak Masaüstü Yöneticisi (hızlı ve ücretsiz sürüm var) ve VNC istemcileri (daha yavaş ve ücretsiz) bulunur.
  • Simülatör yerine test etmek için fiziksel bir cihaz kullanın. Kimlik doğrulama öğreticisini tamamlamak için ücretsiz bir sağlama profili edinebilirsiniz.

Sonraki adımlar

Uygulamaya kimlik doğrulaması ekleyerek öğreticiye devam edin.