نشر تطبيق ويب Node.js في Azure

• أن يكون لديك حساب Azure باشتراك نشط. أنشئ حساباً مجاناً.
• تثبيت Node.js LTS. قم بتشغيل الأمر node --version للتحقق من تثبيت Node.js.
• ثبّت Visual Studio Code.
• تثبيت ملحق Azure App Service ل Visual Studio Code.

• أن يكون لديك حساب Azure باشتراك نشط. أنشئ حساباً مجاناً.
• تثبيت Node.js LTS. قم بتشغيل الأمر node --version للتحقق من تثبيت Node.js.
• قم بتثبيت Azure CLI، الذي يمكنك من خلاله تشغيل الأوامر في shell لإنشاء موارد Azure وتكوينها.

• أن يكون لديك حساب Azure باشتراك نشط. أنشئ حساباً مجاناً.
• تثبيت Node.js LTS. قم بتشغيل الأمر node --version للتحقق من تثبيت Node.js.
• لديك عميل FTP (على سبيل المثال، FileZilla)، للاتصال بتطبيقك.

تسجيل الدخول إلى Azure

1. في المحطة الطرفية، تأكد من أنك في دليل myExpressApp ، ثم ابدأ تشغيل Visual Studio Code باستخدام الأمر التالي:

   code .
   

2. في Visual Studio Code، في شريط النشاط، حدد شعار Azure.

3. في مستكشف App Service ، حدد تسجيل الدخول إلى Azure واتبع الإرشادات.

   في Visual Studio Code، يجب أن تشاهد عنوان بريدك الإلكتروني في Azure في شريط المعلومات واشتراكك في مستكشف App Service .

   

تكوين التطبيق خدمة التطبيقات ونشر التعليمات البرمجية

1. حدد مجلد myExpressApp.

في الجهاز، تأكد من أنك في دليل myExpressApp، ووزع التعليمة البرمجية في مجلدك المحلي (myExpressApp) باستخدام الأمر az webapp up:

az webapp up --sku F1 --name <app-name>

az webapp up --sku F1 --name <app-name> --os-type Windows

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

قد يستغرق الأمر بضع دقائق حتى يكتمل. أثناء التشغيل، يوفر رسائل حول إنشاء مجموعة الموارد وخطة App Service ومورد التطبيق وتكوين التسجيل والقيام بنشر Zip. ثم يعطي الرسالة، "يمكنك تشغيل التطبيق على http://<app-name>.azurewebsites.net"، وهو عنوان URL للتطبيق على Azure. (راجع الملاحظة في بداية هذه المقالة.)

The webapp '<app-name>' doesn't exist
Creating Resource group '<group-name>' ...
Resource group creation complete
Creating AppServicePlan '<app-service-plan-name>' ...
Creating webapp '<app-name>' ...
Configuring default logging for the app, if not already enabled
Creating zip with contents of dir /home/cephas/myExpressApp ...
Getting scm site credentials for zip deployment
Starting zip deployment. This operation can take a while to complete ...
Deployment endpoint responded with status code 202
You can launch the app at http://<app-name>.azurewebsites.net
{
  "URL": "http://<app-name>.azurewebsites.net",
  "appserviceplan": "<app-service-plan-name>",
  "location": "centralus",
  "name": "<app-name>",
  "os": "<os-type>",
  "resourcegroup": "<group-name>",
  "runtime_version": "node|10.14",
  "runtime_version_detected": "0.0",
  "sku": "FREE",
  "src_path": "//home//cephas//myExpressApp"
}

تسجيل الدخول إلى مدخل Microsoft Azure

قم بتسجيل الدخول إلى بوابة Azure.

إنشاء موارد Azure

1. لبدء إنشاء تطبيق Node.js، استعرض للوصول إلى https://portal.azure.com/#create/Microsoft.WebSite.

2. في علامة التبويب Basics ، ضمن Project Details، تأكد من تحديد الاشتراك الصحيح ثم حدد Create new لإنشاء مجموعة موارد. للاسم، اكتب "myResourceGroup".

   

3. ضمن تفاصيل المثيل، اكتب اسمًا فريدًا عالميًا لتطبيق الويب وحدد الرمز. (راجع الملاحظة في بداية هذه المقالة.) حدد Node 18 LTS في مكدس وقت التشغيل ونظام التشغيل والمنطقة التي تريد خدمة تطبيقك منها.

   

4. ضمن App Service Plan، حدد Create new لإنشاء خطة App Service. اكتب خطة الخدمة الخاصة بي للاسم. للتغيير إلى المستوى المجاني، حدد تغيير الحجم، وحدد علامة التبويب Dev/Test ، وحدد F1، ثم حدد الزر تطبيق في أسفل الصفحة.

   

5. حدد الزر مراجعة + إنشاء أسفل الصفحة.

   

6. بعد عمليات التشغيل للمصادقة، حدد مراجعة + إنشاء بأسفل الصفحة.

7. بعد اكتمال عملية التوزيع، حدد Go to resource.

   

الحصول على بيانات اعتماد FTPS

تدعم خدمة تطبيقات Azure نوعين من بيانات الاعتماد لنشر FTP/S. بيانات الاعتماد المبينة ليست هي نفسها بيانات اعتماد اشتراك Azure الخاصة بك. في هذا القسم، يمكنك الحصول على بيانات اعتماد نطاق التطبيق لاستخدامها مع FileZilla.

1. من صفحة تطبيق App Service، حدد Deployment Center في القائمة اليسرى ثم حدد علامة التبويب FTPS credentials .

   

2. افتح FileZilla وأنشئ موقعًا جديدًا.

3. من علامة التبويب بيانات اعتماد FTPS، انسخ نقطة نهاية FTPS واسم المستخدم وكلمة المرور إلى FileZilla.

   

4. حدد الاتصال في FileZilla.

نشر الملفات باستخدام FTPS

1. انسخ كافة ملفات الملفات والدلائل إلى الدليل /site/wwwroot في Azure.

   

2. استعرض للوصول إلى عنوان URL للتطبيق للتحقق من أن التطبيق يعمل بشكل صحيح.

2. في مستكشف App Service ، حدد أيقونة Deploy to Web App مرة أخرى، وتأكد من خلال تحديد Deploy مرة أخرى.

3. بمجرد اكتمال التوزيع، حدد استعراض موقع ويب في نافذة الإعلام المنبثقة. يجب أن ترى أن Welcome to Express الرسالة قد تم تغييرها إلى Welcome to Azure.

2. احفظ التغييرات، ثم أعد نشر التطبيق باستخدام الأمر az webapp up مرة أخرى دون أي وسيطات لنظام Linux. إضافة --os-type Windows لنظام التشغيل Windows:

   az webapp up
   

   يستخدم هذا الأمر القيم المخزنة مؤقتًا محليًا في ملف .azure/config، مثل اسم التطبيق ومجموعة الموارد وخطة خدمة التطبيقات.

3. بمجرد اكتمال النشر، قم بتحديث صفحة ويب http://<app-name>.azurewebsites.net. (راجع الملاحظة في بداية هذه المقالة.) يجب أن ترى أنه Welcome to Express تم تغيير الرسالة إلى Welcome to Azure.

2. احفظ التغييرات، ثم أعد نشر التطبيق باستخدام عميل FTP.

3. بمجرد اكتمال النشر، قم بتحديث صفحة ويب http://<app-name>.azurewebsites.net. (راجع ملاحظة في بداية هذه المقالة.) يجب أن ترى أنه Welcome to Express تم تغيير الرسالة إلى Welcome to Azure.

يمكنك دفق إخراج السجل (المكالمات إلى console.log()) من تطبيق Azure مباشرة في إطار إخراج التعليمات البرمجية Visual Studio.

1. في مستكشف خدمة التطبيقات، انقر بزر الماوس الأيمن فوق عقدة التطبيق وحدد بدء سجلات البث.

   

2. إذا طُلب منك إعادة تشغيل التطبيق، فحدد نعم. بمجرد إعادة تشغيل التطبيق، تفتح نافذة إخراج التعليمات البرمجية Visual Studio مع اتصال بتدفق السجل.

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

    Connecting to log stream...
    2020-03-04T19:29:44  Welcome, you are now connected to log-streaming service. The default timeout is 2 hours.
    Change the timeout with the App Setting SCM_LOGSTREAM_TIMEOUT (in seconds).
    

يمكنك الوصول إلى سجلات وحدة التحكم التي تم إنشاؤها من داخل التطبيق والحاوية التي يتم تشغيلها فيها. تتضمن السجلات أي إخراج تم إنشاؤه بواسطة المكالمات إلى console.log().

لدفق السجلات، قم بتشغيل الأمر az webapp log tail:

az webapp log tail

يستخدم الأمر اسم مجموعة الموارد المخزن مؤقتاً في ملف .azure / config.

يمكنك أيضا تضمين المعلمة --logs مع الأمر az webapp up لفتح دفق السجل تلقائيا عند النشر.

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

لإيقاف دفق السجل في أي وقت، حدد Ctrl+C في المحطة الطرفية.

يمكنك الوصول إلى سجلات وحدة التحكم التي تم إنشاؤها من داخل التطبيق والحاوية التي يتم تشغيلها فيها. يمكنك دفق إخراج السجل (المكالمات إلى console.log()) من تطبيق مدخل Microsoft Azure مباشرة في إطار إخراج التعليمات البرمجية Visual Studio.

1. في نفس صفحة خدمة التطبيق بتطبيقك، استخدم القائمة اليسرى للتمرير إلى قسم المراقبة وحدد دفق السجل.

   

2. بعد بضع ثوانٍ، تُظهر نافذة الإخراج رسالة تشير إلى أنك متصل بخدمة تدفق السجل. يمكنك إنشاء المزيد من نشاط الإخراج عن طريق تحديث الصفحة في المستعرض.

    Connecting...
    2021-10-26T21:04:14  Welcome, you are now connected to log-streaming service.
    Starting Log Tail -n 10 of existing logs ----
    /appsvctmp/volatile/logs/runtime/81b1b83b27ea1c3d598a1cdec28c71c4074ce66c735d0be57f15a8d07cb3178e.log
    2021-10-26T21:04:08.614384810Z: [INFO]
    2021-10-26T21:04:08.614393710Z: [INFO]  # Enter the source directory to make sure the script runs where the user expects
    2021-10-26T21:04:08.614399010Z: [INFO]  cd "/home/site/wwwroot"
    2021-10-26T21:04:08.614403210Z: [INFO]
    2021-10-26T21:04:08.614407110Z: [INFO]  export NODE_PATH=/usr/local/lib/node_modules:$NODE_PATH
    2021-10-26T21:04:08.614411210Z: [INFO]  if [ -z "$PORT" ]; then
    2021-10-26T21:04:08.614415310Z: [INFO]          export PORT=8080
    2021-10-26T21:04:08.614419610Z: [INFO]  fi
    2021-10-26T21:04:08.614423411Z: [INFO]
    2021-10-26T21:04:08.614427211Z: [INFO]  node /opt/startup/default-static-site.js
    Ending Log Tail of existing logs ---
    

في الخطوات السابقة، أنشأت موارد Azure في إحدى مجموعات الموارد. تضع الخطوات الواردة في هذا التشغيل السريع جميع الموارد في مجموعة الموارد هذه. للتنظيف، تحتاج فقط إلى إزالة مجموعة الموارد.

1. في ملحق Azure Visual Studio توسيع مستكشف Resource Groups.

2. قم بتوسيع الاشتراك، وانقر بزر الماوس الأيمن فوق مجموعة الموارد التي أنشأتها سابقًا، وحدد حذف.

   

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

في الخطوات السابقة، أنشأت موارد Azure في إحدى مجموعات الموارد. تحتوي مجموعة الموارد على اسم مثل "appsvc_rg_Linux_CentralUS"، اعتمادا على موقعك.

إذا كنت لا تتوقع أن تحتاج إلى هذه الموارد في المستقبل، فاحذف مجموعة الموارد عن طريق تشغيل الأمر التالي:

az group delete --no-wait

يستخدم الأمر اسم مجموعة الموارد المخزن مؤقتاً في ملف .azure / config.

تسمح الوسيطة --no-wait للأمر بالعودة قبل اكتمال العملية.

يمكنك حذف مجموعة الموارد وخدمة التطبيقات وجميع الموارد ذات الصلة عندما لا تكون هناك حاجة إليها.

1. من صفحة نظرة عامة على خدمة التطبيق، حدد مجموعة الموارد التي أنشأتها في خطوة إنشاء موارد Azure.

   

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