تشغيل سريع: إنشاء دالة JavaScript في Azure باستخدام Visual Studio Code

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

استخدم Visual Studio Code لإنشاء دالة JavaScript تستجيب لطلبات HTTP. اختبر التعليمة البرمجية محليًا، ثم انشرها في محيط بدون خادم لـ Azure Functions.

يتطلب إكمال هذا التشغيل السريع تكلفة صغيرة تبلغ بضعة سنتات أمريكية أو أقل في الحساب في Azure.

هناك أيضاً إصدار يستند إلى واجهة سطر الأوامر من هذه المقالة.

كوِّن بيئتك

قبل البدء، تأكد من وجود المتطلبات التالية:

⁧⁩⁧⁩إنشاء مشروعك المحلي

يمكنك في هذا القسم استخدام Visual Studio Code لإنشاء مشروع Azure Functions محلي في JavaScript. لاحقاً في هذه المقالة، ستنشر رمز دالتك إلى Azure.

  1. اختر رمز Azure الموجود في شريط النشاط، ثم في منطقة Azure: Functions، حدد رمز إنشاء مشروع جديد... .

    Choose Create a new project

  2. اختر موقع دليل لمساحة عمل مشروعك واختر ⁧⁩تحديد⁧⁩.

    ملاحظة

    صُممت هذه الخطوات لتُستكمل خارج مساحة العمل. في هذه الحالة، لا تقم بتحديد مجلد مشروع جزء من مساحة عمل.

  3. قدّم المعلومات التالية عند المطالبات:

    المطالبة التحديد
    حدد اللغة الخاصة بمشروع الدالة. اختر JavaScript.
    تحديد قالب للدالة الأولى لمشروعك اختر HTTP trigger.
    منح الدالة اسماً اكتب ⁧HttpExample⁩.
    مستوى التخويل اختر Anonymous بحيث يتمكن أي شخص من استدعاء نقطة النهاية للدالة. للتعرف على مستويات التخويل، راجع مفاتيح التخويل.
    تحديد طريقة فتح مشروعك اختر Add to workspace.

    باستخدام هذه المعلومات، ينشئ Visual Studio Code مشروع دالات Azure مع مشغل .HTTP يمكن عرض ملفات المشروع المحلي في المستكشف. لمعرفة المزيد حول الملفات المُنشأة راجع ملفات المشروع المُنشأة.

تشغيل الدالة محليًا

تعليمة Visual Studio برمجية مع ⁧⁩Azure Functions Core tools⁧⁩ للسماح لك بتشغيل هذا المشروع في حاسوب التنمية المحلية الخاص بك قبل أن تقوم بالنشر إلى Azure.

  1. لاستدعاء دالتك، اضغط ⁧⁩F5⁧⁩ لبدء مشروع تطبيق الدالة. يُعرض الإخراج من الأدوات الأساسية في لوحة Terminal. يبدأ تطبيقك في لوحة ⁧⁩Terminal⁧⁩. يمكنك مشاهدة نقطة نهاية URL للوظيفة التي تم تشغيلها بواسطة HTTP وتعمل محليًا.

    Local function VS Code output

    إذا واجهتك مشكلة في تشغيل ويندوز، فتأكد من أن المحطة الطرفية الافتراضية للتعليمة البرمجية Visual Studio لم يتم ضبطها على ⁧⁩WSL Bash⁧⁩.

  2. مع تشغيل Core Tools، انتقل إلى ⁧⁩ Azure: منطقة ⁧⁩الدوال. تحت ⁧⁩الدوال⁧⁩، قم بتوسيع مشروع ⁧⁩الدوال⁧⁩⁧>⁩⁧⁩المحلية⁧⁩. انقر بزر الماوس الأيمن فوق (Windows) أو اضغط على ⁦⁧⁩⁩Ctrl -⁦⁧⁩⁩ (في macOS) على الدالة HttpExample واختر ⁩⁩تنفيذ الدالة الآن..⁦.⁦⁩.

    Execute function now from Visual Studio Code

  3. في إدخال نص الطلب، ترى قيمة نص رسالة الطلب { "name": "Azure" }. اضغط «Enter» لإرسال رسالة الطلب هذه إلى الدالة الخاصة بك.

  4. عند تنفيذ الدالة محليًا، وإرجاع استجابة، يتم رفع إشعار في التعليمة البرمجية لـ Visual Studio. يتم عرض معلومات حول تنفيذ الدالة في اللوحة ⁩الطرفية⁧⁩.

  5. مع تركيز لوحة المحطة الطرفية ، اضغط على Ctrl + C لإيقاف الأدوات الأساسية وفصل مصحح الأخطاء.

بعد التحقق من أن الدالة تعمل بشكل صحيح على الحاسوب المحلي، حان الوقت لاستخدام Visual Studio Code لنشر المشروع مباشرة على Azure.

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

قبل أن تتمكن من نشر التطبيق، ينبغي تسجيل الدخول إلى Azure.

  1. إذا لم تكن قد سجلت الدخول بالفعل، فاختر رمز Azure في شريط النشاط، ثم في منطقة Azure: وظائف، اختر تسجيل الدخول إلى Azure... . إذا لم يكن لديك حساب بالفعل، يمكنك إنشاء حساب Azure مجانًا . يمكن للطلاب إنشاء حساب Azure مجاني للطلاب .

    Sign in to Azure within VS Code

    إذا قمت بتسجيل الدخول بالفعل، فانتقل إلى القسم التالي.

  2. عندما يطلب منك في المتصفح، اختر حساب Azure الخاص بك، ثم سجل الدخول باستخدام بيانات اعتماد حساب Azure.

  3. بعد تسجيل الدخول بنجاح، يمكنك إغلاق نافذة المتصفح الجديد. تُعرض الاشتراكات التي تنتمي إلى حساب Azure في الشريط الجانبي.

نشر المشروع في Azure

في هذا القسم، يمكنك إنشاء تطبيق الدالة والموارد ذات الصلة في اشتراك Azure الخاص بك، ونشر الرمز الخاص بك.

هام

التوزيع إلى تطبيق دالة موجود يحل محل محتوى هذا التطبيق في Azure.

  1. اختر أيقونة Azure الموجودة في شريط النشاط، ثم في ⁧منطقة ⁩⁩Azure: Functions⁦⁦، اختر زر ⁩⁩Deploy to function app...⁦⁦

    Publish your project to Azure

  2. قدّم المعلومات التالية عند المطالبات:

    المطالبة التحديد
    تحديد Function App في Azure اختر + Create new Function App. (تجنب اختيار ⁧Advanced⁩ الخيار الذي لا يشمله هذا المقال.)
    أدخل اسماً فريداً عالمياً لتطبيق الوظائف اكتب اسماً صالحاً في مسار URL. يتم التحقق من صحة الاسم الذي تكتبه للتأكد من أنه مميز في تطبيق Azure Functions.
    تحديد وقت تشغيل اختر إصدار Node.js الذي تشغله محلياً. يمكنك استخدام ⁧node --version⁩ الأمر للتحقق من الإصدار الخاص بك.
    حدد موقعاً للموارد الجديدة للحصول على أداء أفضل، اختر منطقة قريبة منك.

    يعرض الملحق حالة الموارد الفردية أثناء إنشائها في Azure في مساحة الإخطار.

    Notification of Azure resource creation

    عند الانتهاء، يتم إنشاء موارد Azure التالية في اشتراكك، باستخدام أسماء تستند إلى اسم تطبيق الدالة الخاص بك:

    • مجموعة موارد، وهي حاوية منطقية للموارد ذات الصلة.
    • حساب قياسي في Azure Storage: الذي يحتفظ بالحالة والمعلومات الأخرى بشأن مشروعك.
    • خطة استهلاك، التي تحدد المضيف الأساسي لتطبيق الوظائف بلا خادم.
    • تطبيق الدالة، الذي يوفر البيئة لتنفيذ رمز الدالة. يوفر لك تطبيق الوظيفة تجميع الوظائف كوحدة منطقية لتيسير إدارة الموارد ونشرها ومشاركتها داخل خطة المضيف ذاتها.
    • مثيل Application Insights المتصل بتطبيق الدالة، الذي يتتبع استخدام الدالة لديك بلا خادم.

  3. يُعرض إشعار بعد إنشاء تطبيق الدوال الخاص بك وتطبيق حزمة التوزيع.

    تلميح

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

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

    Create complete notification

تشغيل الوظيفة في Azure

  1. مرة أخرى في Azure: دالات المنطقة في الشريط الجانبي، وتوسيع الاشتراك الخاص بك، تطبيق دالتك الجديدة، ودالات. انقر بزر الماوس الأيمن فوق (Windows) أو اضغط على ⁦⁧⁩⁩Ctrl -⁦⁧⁩⁩ (في macOS) على الدالة HttpExample واختر ⁩⁩تنفيذ الدالة الآن..⁦.⁦⁩.

    Execute function now in Azure from Visual Studio Code

  2. في إدخال نص الطلب، ترى قيمة نص رسالة الطلب { "name": "Azure" }. اضغط على "Enter" لإرسال رسالة الطلب إلى الدالة الخاصة بك.

  3. عند تنفيذ الدالة في منصة خدمة Azure وإرجاع استجابة، يتم إرسال إشعار في كود Visual Studio.

تغيير التعليمات البرمجية وإعادة التوزيع إلى Azure

  1. في عرض VSCode Explorer حدد الملف ./HttpExample/index.js.

  2. استبدال الملف مع التعليمة البرمجية التالية لإنشاء كائن JSON وإعادته.

    module.exports = async function (context, req) {

    try {
        context.log('JavaScript HTTP trigger function processed a request.');

        // Read incoming data
        const name = (req.query.name || (req.body && req.body.name));
        const sport = (req.query.sport || (req.body && req.body.sport));

        // fail if incoming data is required
        if (!name || !sport) {

            context.res = {
                status: 400
            };
            return;
        }

        // Add or change code here
        const message = `${name} likes ${sport}`;

        // Construct response
        const responseJSON = {
            "name": name,
            "sport": sport,
            "message": message,
            "success": true
        }

        context.res = {
            // status: 200, /* Defaults to 200 */
            body: responseJSON,
            contentType: 'application/json'
        };
    } catch(err) {
        context.res = {
            status: 500
        };
    }
}

  3. أعد تشغيل تطبيق الدالة محلياً.

  4. في المطالبة أدخل نص الطلب تغيير نص رسالة الطلب إلى { "name": "Tom","sport":"basketball" }. اضغط على "Enter" لإرسال رسالة الطلب إلى الدالة الخاصة بك.

  5. عرض الاستجابة في الإعلام:

    {
  "name": "Tom",
  "sport": "basketball",
  "message": "Tom likes basketball",
  "success": true
}

  6. إعادة توزيع الدالة إلى Azure.

استكشاف الأخطاء وإصلاحها

استخدم الجدول أدناه لحل المشاكل الأكثر شيوعاً التي تمت مواجهتها عند استخدام هذا التشغيل السريع.

مشكلة حل
ألا يمكن إنشاء مشروع دالة محلية؟ تأكد من تثبيت ملحق دوال Azure.
⁧⁩ألا تستطيع تشغيل الدالة محليًا؟⁧⁩ تأكد من تثبيت Azure Functions Core Tools.
عند التشغيل على Windows، فتأكد من عدم تعيين غلاف المحطة الطرفية الافتراضي لـ Visual Studio Code على WSL Bash.
ألا يمكنك توزيع الدالة إلى Azure؟ راجع الإخراج للحصول على معلومات الخطأ. يعد رمز الجرس الموجود في الزاوية اليمنى السفلية طريقة أخرى لعرض الإخراج. هل قمت بالنشر إلى تطبيق وظيفي موجود؟ يستبدل هذا الإجراء محتوى هذا التطبيق في Azure.
هل تعذر تشغيل تطبيق الدالة المستند إلى السحابة؟ تذكر استخدام سلسلة الاستعلام لإرسال المعلمات.

تنظيف الموارد

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

بخلاف ذلك، يمكنك استخدام الخطوات التالية لحذف تطبيق الدالة والموارد المرتبطة به لتجنب تكبد أي تكاليف إضافية.

  1. في Visual Studio Code، حدد رمز Azure لفتح Azure explorer.
  2. في قسم مجموعات الموارد، ابحث عن مجموعة الموارد.
  3. انقر بزر الماوس الأيمن فوق مجموعة الموارد وحددحذف.

لمعرفة المزيد حول تكاليف الدوال، يُرجى الاطلاع على ⁧⁩تقدير تكاليف خطة الاستهلاك⁧⁩.

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

لقد استخدمت Visual Studio Codeلإنشاء تطبيق دوال باستخدام دالة بسيطة تعمل بواسطة مشغل "HTTP". في المقالة التالية، يمكنك توسيع هذه الدالة عن طريق الاتصال إما بـ Azure Cosmos DB أو Azure Storage. لمعرفة المزيد حول الاتصال بخدمات Azure الأخرى، راجع إضافة روابط إلى دالة قائمة في Azure Functions. إذا كنت تريد معرفة المزيد عن الأمان، راجع تأمين وظائف Azure.

الاتصال بـ Azure Cosmos DBالاتصال بتخزين Azure Queue Storage