Quickstart: إنشاء تطبيق ويب ASP.NET Core في Azure

  • مقالة
  • قراءة خلال 6 دقائق

في هذه البداية السريعة، ستتعرف على كيفية إنشاء تطبيق الويب ASP.NET Core الأول ونشره في Azure App Service. تدعم خدمة التطبيقات تطبيقات .NET 5.0.

عند الانتهاء، سيكون لديك مجموعة موارد Azure، تتكون من خطة خدمة التطبيقات وتطبيق خدمة التطبيقات مع نموذج منشور ASP.NET تطبيق Core.

1. إعداد بيئتك

هل لديك بالفعل Visual Studio 2019؟ إذا قمت بتثبيت Visual Studio 2019 بالفعل:
  • قم بتثبيت آخر التحديثات في Visual Studio عن طريق تحديد HelpCheck>for Updates. تحتوي آخر التحديثات على .NET 5.0 SDK.
  • أضف عبء العمل عن طريق تحديد أدواتالحصول>على الأدوات والميزات.

2. إنشاء تطبيق ويب ASP.NET Core

  1. افتح Visual Studio وحدد "Create a new project".

  2. في إنشاء مشروع جديد ، حدد "ASP.NET Core Web Application" وتأكد من أن C#‎ مدرج باللغات الخاصة بهذا الاختيار، ثم حدد "Next".

  3. في تكوين مشروعك الجديد، قم بتسمية مشروع تطبيق الويب الخاص بك myFirstAzureWebApp، وحدد "Create".

    Configure your web app project

  4. بالنسبة لتطبيق .NET 5.0، حدد "ASP.NET Core 5.0" في القائمة المنسدلة. خلاف ذلك، استخدم القيمة الافتراضية.

  5. يمكنك نشر أي نوع من تطبيقات الويب ASP.NET Core على Azure، ولكن لبدء التشغيل السريع هذا، اختر نموذج "ASP.NET Core Web App". تأكد من تعيين المصادقة على بلا مصادقة، وعدم تحديد أي خيار آخر. ثم، قم بتحديد إنشاء.

    Create a new ASP.NET Core web app

  6. من قائمة Visual Studio، حدد "Debug" >بدء بدون تصحيح لتشغيل تطبيق الويب محلياً.

    Web app running locally

3. انشر تطبيق الويب الخاص بك

  1. في مستكشف الحلول، انقر بزر الماوس الأيمن فوق مشروع "myFirstAzureWebApp" وحدد "Publish".

  2. في نشر، حدد "Azure" وانقر على "Next".

  3. تعتمد خياراتك على ما إذا كنت قد سجلت الدخول إلى Azure بالفعل وما إذا كان لديك حساب Visual Studio مرتبط بحساب Azure. حدد إما "Add an account" أو "Sign in" لتسجيل الدخول إلى اشتراكك في Azure. إذا قمت بتسجيل الدخول بالفعل، فحدد الحساب الذي تريده.

    Sign in to Azure

  4. إلى يسار "App Service instances"، انقر على " + ".

    New App Service app

  5. بالنسبة إلى ⁧⁩الاشتراك⁧⁩، اقبل الاشتراك المدرج أو حدد اشتراكًا جديدًا من القائمة المنسدلة.

  6. بالنسبة إلى مجموعة الموارد، حدد "New". في اسم مجموعة الموارد الجديدة، أدخل myResourceGroup وحدد OK.

  7. بالنسبة إلى خطة الاستضافة، حدد "New".

  8. في مربع الحوار "Hosting Plan: Create new"، أدخل القيم المحددة في الجدول التالي:

    الإعداد القيم المقترحة
    نوع خطة الاستضافة myFirstAzureWebAppPlan
    ⁧⁩الموقع⁧⁩ غرب أوروبا
    ⁦⁩Size⁦⁩ مجاني

    Create new Hosting Plan

  9. في الاسم، أدخل اسماً فريداً للتطبيق.

    ما هي الأحرف التي يمكنني استخدامها؟ الأحرف الصالحة هي a-z و A-Z و 0-9 و -. يمكنك قبول الاسم الفريد الذي تم إنشاؤه تلقائياً. عنوان URL لتطبيق الويب هو http://<app-name>.azurewebsites.net، حيث<app-name> هو اسم التطبيق الخاص بك.

  10. حدد "Create" لإنشاء موارد Azure.

    Create app resources

  11. انتظر حتى ينتهي المعالج من إنشاء موارد Azure. حدد "Finish" لإغلاق المعالج.

  12. في صفحة نشر، انقر فوق "Publish" لنشر مشروعك.

    ما الذي Visual Studio القيام به؟ Visual Studio بإنشاء التطبيق وحزمه ونشره على Azure، ثم يقوم بتشغيل التطبيق في المستعرض الافتراضي.

    Published ASP.NET web app running in Azure

4. تحديث التطبيق وإعادة النشر

  1. في مستكشف الحلول ، ضمن مشروعك، افتح "Pages">Index.cshtml.

  2. استبدل علامة <div> بأكملها بالشفرة التالية:

    <div class="jumbotron">
    <h1>ASP.NET in Azure!</h1>
    <p class="lead">This is a simple app that we've built that demonstrates how to deploy a .NET app to Azure App Service.</p>
</div>

  3. لإعادة النشر إلى Azure، انقر بزر الماوس الأيمن فوق مشروع "myFirstAzureWebApp" في "مستكشف الحلول"" وحدد "Publish".

  4. في صفحة الملخص نشر، حدد "Publish".

    عند اكتمال النشر، يقوم Visual Studio بتشغيل مستعرض إلى عنوان URL لتطبيق الويب.

    Updated ASP.NET web app running in Azure

5. إدارة تطبيق Azure

  1. انتقل إلى 'مدخل Microsoft Azure"، وابحث عن وحدد "App Services".

    Select App Services

  2. في صفحة ⁧⁩App Services،⁧⁩ اختر اسم تطبيق الويب.

    Screenshot of the App Services page with an example web app selected.

  3. تحتوي صفحة ⁧⁩نظرة عامة⁧⁩ لتطبيق الويب الخاص بك على خيارات للإدارة الأساسية مثل التصفح والإيقاف والبدء وإعادة التشغيل والحذف. توفر القائمة اليسرى مزيدًا من الصفحات لتكوين تطبيقك.

    App Service in Azure portal

6. حذف الموارد

  1. من قائمة مدخل Microsoft Azure أو من Home، حدد Resource groups. بعد ذلك، في صفحة مجموعات الموارد، حدد "myResourceGroup".

  2. في صفحة myResourceGroup، تأكد من أن الموارد المدرجة هي التي تريد حذفها.

  3. حدد "Delete resource group"، واكتب "myResourceGroup" في مربع النص للتأكيد، ثم حدد "Delete'.

الخطوات التالية

تقدم إلى المقالة التالية لمعرفة كيفية إنشاء تطبيق .NET Core وتوصيله بقاعدة بيانات SQL:

توضح هذه البداية السريعة كيفية إنشاء تطبيق . NET Core على App Service على Linux. يمكنك إنشاء التطبيق باستخدام Azure CLI، واستخدام Git لنشر كود NET Core في التطبيق.

1. إعداد بيئتك

هل تواجه مشكلات؟ أخبرنا.

2. إنشاء التطبيق محلياً

  1. قم بتشغيل mkdir hellodotnetcore لإنشاء الدليل.

    mkdir hellodotnetcore

  2. قم بتشغيل cd hellodotnetcore لتغيير الدليل.

    cd hellodotnetcore

  3. قم بتشغيل dotnet new web لإنشاء تطبيق .NET Core جديد.

    dotnet new web

3. قم بتشغيل التطبيق محلياً

  1. شغّل dotnet run لترى كيف يبدو عند نشره في Azure.

    dotnet run

  2. افتح متصفح الويب، وانتقل إلى التطبيق على http://localhost:5000.

Test with browser

هل تواجه مشكلات؟ أخبرنا.

4. سجّل الدخول إلى Azure

شغّل az login لتسجيل الدخول إلى Azure.

az login

هل تواجه مشكلات؟ أخبرنا.

5. نشر التطبيق

  1. ركضaz webapp up في المجلد المحلي. استبدل< اسم التطبيق مع اسم> فريد من نوعه عالميا.

    az webapp up --sku F1 --name <app-name> --os-type linux
    استكشاف الاخطاء
    • إذا لم يتم التعرف على الأمر az، فتأكد من تثبيت Azure CLI كما هو موضح في إعداد بيئتك.
    • استبدال <app-name>مع اسم هذا فريدة من نوعها في جميع Azure (الحروف الصحيحة هي a-z⁩،0-9⁩، و- ). النمط الجيد هو استخدام مزيج من اسم شركتك ومعرف التطبيق.
    • تقوم الوسيطة --sku F1 بإنشاء تطبيق الويب على طبقة التسعير المجاني. احذف هذه الحجة لاستخدام فئة أقساط أسرع، والتي تتكبد تكلفة بالساعة.
    • يمكنك اختيارياً تضمين الوسيطة --location <location-name> حيث <location-name> هي منطقة Azure متوفرة. يمكنك استرداد قائمة المناطق المسموح بها لحساب Azure الخاص بك عن طريق تشغيل الأمر az account list-locations.

  2. انتظر اكتمال الأمر. قد يستغرق الأمر بضع دقائق، وينتهي بعبارة "يمكنك تشغيل التطبيق على http://< app-name>.azurewebsites.net".

    az webapp up ماذا تفعل؟

    يقومaz webapp upالأمر بالإجراءات التالية:

    • إنشاء مجموعة موارد افتراضية.
    • إنشاء خطة خدمات تطبيق افتراضية.
    • إنشاء تطبيق خدمة التطبيقات بالاسم المحدد.
    • نشر Zip للملفات من دليل العمل الحالي إلى التطبيق.
    • أثناء التشغيل، يوفر رسائل حول إنشاء الموارد والتسجيل ونشر ZIP.

هل تواجه مشكلات؟ أبلغنا بها.

6. تصفح إلى التطبيق

تصفح إلى التطبيق المنشور باستخدام متصفح الويب الخاص بك.

http://<app_name>.azurewebsites.net

Sample app running in Azure

هل تواجه مشكلات؟ أبلغنا بها.

7. تحديث وإعادة نشر الكود

  1. افتح ملف "Startup.cs" في الدليل المحلي.

  2. قم بإجراء تغيير طفيف على النص الموجود في استدعاء الطريقةcontext.Response.WriteAsync.

    await context.Response.WriteAsync("Hello Azure!");

  3. احفظ التغييرات.

  4. ركضaz webapp up لإعادة نشر:

    az webapp up --os-type linux
    ماذا تفعل هذه المرة az webapp up ؟ في المرة الأولى التي قمت فيها بتشغيل الأمر، قام بحفظ اسم التطبيق ومجموعة الموارد وخطة خدمة التطبيق في ملف . azure/config من جذر المشروع. عند تشغيله مرة أخرى من جذر المشروع، فإنه يستخدم القيم المحفوظة في .azure/config، ويكتشف أن موارد خدمة التطبيق موجودة بالفعل، وينفذ نشر Zip مرة أخرى.

  5. بمجرد اكتمال النشر، "hit refresh" في نافذة المتصفح التي تم فتحها مسبقاً.

    Updated sample app running in Azure

هل تواجه مشكلات؟ أبلغنا بها.

8. إدارة تطبيق Azure الجديد

  1. انتقل إلى مدخل Microsoft Azure.

  2. من القائمة اليسرى، انقر فوق App Services ثم انقر فوق اسم تطبيق Azure.

    Screenshot of the App Services page showing an example Azure app selected.

  3. صفحة النظرة العامة هي المكان الذي يمكنك فيه أداء مهام الإدارة الأساسية مثل التصفح والإيقاف والبدء وإعادة التشغيل والحذف. توفر القائمة على الجانب الأيسر صفحات مختلفة لتكوين التطبيق.

    App Service page in Azure portal

9. حذف الموارد

ركضaz group delete --name myResourceGroup لحذف مجموعة الموارد.

az group delete --name myResourceGroup

هل تواجه مشكلات؟ أبلغنا بها.

الخطوات التالية