إضافة مصادقة إلى تطبيق Apache Cordova

الملخص

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

سجل تطبيقك للمصادقة وقم بتكوين خدمة التطبيق

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

  1. قم بتكوين موفر الهوية المفضل لديك باتباع الإرشادات الخاصة بالموفر:

  2. كرر الخطوات السابقة لكل موفر تريد دعمه في تطبيقك.

مشاهدة فيديو يعرض خطوات مشابهة

تقييد الأذونات للمستخدمين المصادق عليهم

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

  • Node.js الخلفية (عبر بوابة Azure):

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

  • نهاية خلفية .NET (C #):

    في مشروع الخادم، انتقل إلى ControllersTodoItemController>.cs. إضافة السمة [Authorize] إلى فئة TodoItemController كما يلي. لتقييد الوصول إلى طرق محددة فقط، يمكنك أيضا تطبيق هذه السمة فقط على هذه الطرق بدلا من الفصل. إعادة نشر مشروع الخادم.

      [Authorize]
      public class TodoItemController : TableController<TodoItem>
    
  • Node.js الخلفية (عبر رمز Node.js):

    لطلب المصادقة للوصول إلى الجدول، أضف السطر التالي إلى البرنامج النصي لخادم Node.js:

      table.access = 'authenticated';
    

    لمزيد من التفاصيل، راجع كيفية: طلب المصادقة للوصول إلى الجداول. لمعرفة كيفية تنزيل مشروع رمز التشغيل السريع من موقعك، راجع كيفية: تنزيل مشروع شفرة التشغيل السريع للواجهة الخلفية Node.js باستخدام Git.

الآن ، يمكنك التحقق من تعطيل الوصول المجهول إلى الواجهة الخلفية. في Visual Studio:

  • افتح المشروع الذي قمت بإنشائه عند الانتهاء من البرنامج التعليمي بدء استخدام تطبيقات الجوال.
  • قم بتشغيل تطبيقك في محاكي Google Android.
  • تحقق من ظهور فشل اتصال غير متوقع بعد بدء تشغيل التطبيق.

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

إضافة مصادقة إلى التطبيق

  1. افتح مشروعك في Visual Studio، ثم افتح www/index.html الملف للتحرير.

  2. حدد موقع العلامة الوصفية Content-Security-Policy في قسم الرأس. أضف مضيف OAuth إلى قائمة المصادر المسموح بها.

    ⁧⁩"الموفر"⁧⁩ اسم موفر SDK مضيف OAuth
    Azure Active Directory عاد https://login.microsoftonline.com
    Facebook الفيسبوك https://www.facebook.com
    Google جوجل https://accounts.google.com
    Microsoft حساب مايكروسوفت https://login.live.com
    Twitter التغريد https://api.twitter.com

    مثال على سياسة أمان المحتوى (التي تم تنفيذها ل Azure Active Directory) كما يلي:

     <meta http-equiv="Content-Security-Policy" content="default-src 'self'
         data: gap: https://login.microsoftonline.com https://yourapp.azurewebsites.net; style-src 'self'">
    

    استبدل https://login.microsoftonline.com بمضيف OAuth من الجدول السابق. لمزيد من المعلومات حول العلامة الوصفية لنهج أمان المحتوى، راجع وثائق المحتوى-الأمان-النهج.

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

  3. www/js/index.js افتح الملف للتحرير، وحدد موقع الطريقةonDeviceReady()، وضمن التعليمات البرمجية لإنشاء العميل أضف التعليمة البرمجية التالية:

     // Login to the service
     client.login('SDK_Provider_Name')
         .then(function () {
    
             // BEGINNING OF ORIGINAL CODE
    
             // Create a table reference
             todoItemTable = client.getTable('todoitem');
    
             // Refresh the todoItems
             refreshDisplay();
    
             // Wire up the UI Event Handler for the Add Item
             $('#add-item').submit(addItemHandler);
             $('#refresh').on('click', refreshDisplay);
    
             // END OF ORIGINAL CODE
    
         }, handleError);
    

    يحل هذا الرمز محل التعليمة البرمجية الموجودة التي تقوم بإنشاء مرجع الجدول وتحديث واجهة المستخدم.

    تبدأ طريقة تسجيل الدخول () المصادقة مع الموفر. طريقة تسجيل الدخول () هي دالة غير متزامنة ترجع وعد جافا سكريبت. يتم وضع بقية التهيئة داخل استجابة الوعد بحيث لا يتم تنفيذها حتى تكتمل طريقة تسجيل الدخول () .

  4. في الرمز الذي أضفته للتو، استبدله SDK_Provider_Name باسم موفر تسجيل الدخول الخاص بك. على سبيل المثال، بالنسبة ل Azure Active Directory، استخدم client.login('aad').

  5. قم بتشغيل مشروعك. عند الانتهاء من تهيئة المشروع، يعرض تطبيقك صفحة تسجيل الدخول إلى OAuth لموفر المصادقة المختار.

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

  • تعرف على المزيد حول المصادقة باستخدام خدمة تطبيقات Azure.
  • تابع البرنامج التعليمي عن طريق إضافة إشعارات الدفع إلى تطبيق Apache Cordova الخاص بك.

تعرف على كيفية استخدام SDKs.