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

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

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

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

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

• اشتراك Azure - أنشئ اشتراكاً مجاناً.
• بمجرد اشتراكك في Azure، أنشئ مورد Face في مدخل Microsoft Azure للحصول على المفتاح ونقطة النهاية. بعد انتشاره، حدد "Go to resource".
  • ستحتاج إلى المفتاح ونقطة النهاية من المورد الذي أنشأته لتوصيل تطبيقك بواجهة برمجة تطبيقات Face.

هام

اعتبارات الأمان

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

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

Android

1. استنساخ مستودع git لعينة التطبيق.

2. لإعداد بيئة التطوير الخاصة بك، اتبع وثائق React Native . حدد React Native CLI التشغيل السريع. حدد نظام التشغيل الذي تم تطويره وAndroid ليكون نظام التشغيل المستهدف. أكمل القسمين تثبيت التبعيات وبيئة تطوير Android.

3. قم بتنزيل محرر النصوص المفضل لديك مثل Visual Studio Code.

4. استردّ نقطة نهاية FaceAPI والمفتاح في مدخل Azure ضمن علامة التبويب نظرة عامة في موردك. لا تحقق من مفتاح Face API الخاص بك إلى المستودع البعيد.

   تحذير

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

5. قم بتشغيل التطبيق باستخدام إما محاكي Android Virtual Device من Android Studio، أو جهاز Android الخاص بك. لاختبار تطبيقك على جهاز فعلي، اتبع وثائق React Native ذات الصلة .

iOS

1. استنساخ مستودع git لعينة التطبيق.

2. لإعداد بيئة التطوير الخاصة بك، اتبع وثائق React Native . حدد React Native CLI التشغيل السريع. حدد macOS كنظام تشغيل للتطوير وiOS باعتباره نظام التشغيل المستهدف. أكمل قسم Installing dependencies.

3. قم بتنزيل محرر النصوص المفضل لديك مثل Visual Studio Code. ستحتاج أيضاً إلى تنزيل Xcode.

4. استردّ نقطة نهاية FaceAPI والمفتاح في مدخل Azure ضمن علامة التبويب نظرة عامة في موردك.

   تحذير

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

5. قم بتشغيل التطبيق إما باستخدام جهاز محاكاة من Xcode، أو جهاز iOS الخاص بك. لاختبار تطبيقك على جهاز فعلي، اتبع وثائق React Native ذات الصلة .

تخصيص التطبيق لأعمالك

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

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

1. أضف المزيد من الإرشادات لتحسين دقة التحقق.

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

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

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

   

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

   

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

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

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

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

نشر التطبيق

Android

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

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

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

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

iOS

أولاً، تأكد من أن تطبيقك جاهز للتوزيع الإنتاجي: أزل أي مفاتيح أو بيانات سرية من تعليمة برمجية التطبيق وتأكد من اتباعك أفضل ممارسات الأمان. للتحضير للتوزيع، ستحتاج إلى إنشاء رمز تطبيق وشاشة تشغيل وتكوين إعدادات معلومات التوزيع. اتبع وثائق Xcode لتجهيز التطبيق للتوزيع.

عندما تكون جاهزاً لإصدار تطبيقك للإنتاج، ستنشئ أرشيفاً لتطبيقك. اتبع وثائق Xcode حول كيفية إنشاء بنية أرشيف وخيارات لتوزيع تطبيقك.

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

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