إنشاء تطبيق React لإضافة مستخدمين إلى خدمة Face

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

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

تتم كتابة نموذج التطبيق باستخدام جافا سكريبت وإطار React Native. يمكن نشره حاليا على أجهزة Android و iOS ؛ المزيد من خيارات النشر قادمة في المستقبل.

المتطلبات الأساسية

  • اشتراك Azure - أنشئ اشتراكا مجانا.
  • بمجرد حصولك على اشتراكك في Azure، قم بإنشاء مورد Face في مدخل Azure للحصول على المفتاح ونقطة النهاية. وبعد نشره انقر فوق اذهب إلى المورد.
    • ستحتاج إلى المفتاح ونقطة النهاية من المورد الذي أنشأته لتوصيل تطبيقك بواجهة برمجة تطبيقات الوجه.
    • بالنسبة للتطوير والاختبار المحليين فقط، يعد مفتاح واجهة برمجة التطبيقات ونقطة النهاية متغيرات بيئية. للنشر النهائي، قم بتخزين مفتاح واجهة برمجة التطبيقات في موقع آمن وليس في متغيرات التعليمات البرمجية أو البيئة.

اعتبارات أمنية مهمة

  • بالنسبة للتنمية المحلية والاختبار الأولي المحدود، من المقبول (وإن لم يكن أفضل الممارسات) استخدام متغيرات البيئة للاحتفاظ بمفتاح واجهة برمجة التطبيقات ونقطة النهاية. بالنسبة لعمليات النشر التجريبية والنهائية ، يجب تخزين مفتاح واجهة برمجة التطبيقات بشكل آمن - والذي من المحتمل أن يتضمن استخدام خدمة وسيطة للتحقق من صحة رمز المستخدم المميز الذي تم إنشاؤه أثناء تسجيل الدخول.
  • لا تقم أبدا بتخزين مفتاح واجهة برمجة التطبيقات أو نقطة النهاية في التعليمات البرمجية أو إلزامها بنظام التحكم في الإصدار (مثل Git). إذا حدث ذلك عن طريق الخطأ ، فيجب عليك إنشاء مفتاح / نقطة نهاية واجهة برمجة تطبيقات جديدة على الفور وإلغاء المفاتيح السابقة.
  • كأفضل ممارسة ، ضع في اعتبارك وجود مفاتيح API منفصلة للتطوير والإنتاج.

إعداد بيئة التطوير

  1. استنساخ مستودع git لنموذج التطبيق.
  2. لإعداد بيئة التطوير الخاصة بك، اتبع وثائق React Native . حدد React Native التشغيل السريع CLI. حدد نظام التشغيل الخاص بك و Android كنظام تشغيل مستهدف. أكمل الأقسام تثبيت التبعياتوبيئة تطوير Android.
  3. قم بتنزيل محرر النصوص المفضل لديك مثل رمز Visual Studio.
  4. استرجع نقطة نهاية FaceAPI ومفتاحها في مدخل Azure ضمن علامة التبويب نظرة عامة في المورد. لا تقم بإيداع مفتاح Face API في المستودع البعيد.
  5. قم بتشغيل التطبيق إما باستخدام محاكي جهاز Android الظاهري من Android Studio ، أو جهاز Android الخاص بك. لاختبار تطبيقك على جهاز فعلي، اتبع وثائق React Native ذات الصلة.

إنشاء تجربة إضافة مستخدم

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

على سبيل المثال، قد ترغب في إضافة معلومات خاصة بالموقف في صفحة الموافقة الخاصة بك:

app consent page

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

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

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

app image capture instruction page

لاحظ أن التطبيق يوفر أيضا وظائف لحذف معلومات المستخدم وخيار إعادة الإضافة.

profile management page

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

توزيع التطبيق

أولا، تأكد من أن تطبيقك جاهز لنشر الإنتاج: أزل أي مفاتيح أو أسرار من رمز التطبيق وتأكد من اتباع أفضل ممارسات الأمان.

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

اتبع وثائق التحضير للإصدار لمعرفة كيفية إنشاء مفتاح خاص وتوقيع التطبيق وإنشاء ملف APK للإصدار .

بمجرد إنشاء ملف APK موقع، راجع نشر وثائق تطبيقك لمعرفة المزيد حول كيفية إصدار تطبيقك .

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

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