بناء مصادقة CapacitorJS باستخدام Logto
في هذا الدليل، سنوضح كيفية بناء تدفق المصادقة باستخدام Logto في Capacitor. سيمكنك هذا من إنشاء تدفقات تسجيل الدخول والتسجيل عبر الأنظمة بسهولة.
في هذا الدليل، سنوضح كيفية بناء تدفق المصادقة باستخدام Logto في Capacitor. سيمكنك هذا من إنشاء تدفقات تسجيل الدخول والتسجيل عبر الأنظمة بسهولة.
في هذا الدليل، سنوضح كيفية بناء تدفق المصادقة باستخدام Logto في Capacitor. سيمكنك هذا من إنشاء تدفقات تسجيل الدخول والتسجيل عبر الأنظمة بسهولة.
قبل البدء، تأكد من توفر ما يلي:
لبدء الاستخدام، قم بإنشاء تطبيق Logto من النوع "Native". تعمل تطبيقات Logto كتطبيقات عملاء في تدفقات OAuth 2.0 و OpenID Connect (OIDC). اتبع هذه الخطوات لإنشاء تطبيق Logto:

بعد إنشاء تطبيق Logto، قم بتكوين URI إعادة التوجيه. يُستخدم URI إعادة التوجيه لإعادة توجيه المستخدم إلى تطبيقك بعد تدفق المصادقة.
تأكد من أن URI يعيد التوجيه إلى تطبيق Capacitor، على سبيل المثال، com.example.app://callback. قد يختلف القيمة بناءً على إعدادات تطبيق Capacitor الخاص بك. لمزيد من التفاصيل، راجع روابط عميقة Capacitor.
تذكر النقر على حفظ التغييرات بعد تحديث URI إعادة التوجيه.
إذا لم تكن متأكدًا من URI إعادة التوجيه، يمكنك تركه فارغًا الآن وتحديثه لاحقًا.
بافتراض أنك لديك بالفعل مشروع Capacitor، هذا الدليل مستقل عن الإطار، لذا يمكنك استخدام أي إطار واجهة مستخدم تفضله وتحديث الكود وفقًا لذلك.
endpoint هو نقطة نهاية API لـ Logto. يمكنك العثور عليه في الدليل المدمج أو قسم Domains في إعدادات المستأجر.appId هو معرف تطبيق Logto. يمكنك العثور عليه في صفحة تفاصيل التطبيق.أضف الكود التالي إلى معالج onClick لزر تسجيل الدخول:
استبدل com.example.app://callback بـ URI إعادة التوجيه الذي قمت بتكوينه في تطبيق Logto.
قم بتشغيل تطبيق Capacitor وانقر على زر تسجيل الدخول. سيتم فتح نافذة متصفح تعيد التوجيه إلى صفحة تسجيل الدخول في Logto.

نظرًا لأن Capacitor يستخدم Safari View Controller على iOS وChrome Custom Tabs على Android، يمكن الاحتفاظ بحالة المصادقة لفترة. ومع ذلك، أحيانًا قد يرغب المستخدم في تسجيل الخروج من التطبيق فورًا. في هذه الحالة، يمكننا استخدام طريقة signOut لتسجيل خروج المستخدم:
تحتوي طريقة signOut على معامل اختياريا ل URI إعادة التوجيه بعد تسجيل الخروج. إذا لم يتم توفيره، سيتم إعادة توجيه المستخدم إلى صفحة تسجيل الخروج في Logto:

يحتاج المستخدم إلى النقر على "تم" لإغلاق عرض الويب والعودة إلى تطبيق Capacitor. إذا كنت تريد إعادة توجيه المستخدم تلقائيًا إلى تطبيق Capacitor، يمكنك تقديم URI إعادة التوجيه بعد تسجيل الخروج:
تأكد من أن URI يعيد التوجيه بعد تسجيل الخروج إلى تطبيق Capacitor، وتذكر إضافة URI إعادة التوجيه بعد تسجيل الخروج إلى لوحة تحكم Logto:

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

ثم انقر على زر تسجيل الخروج، وسيتم إعادة توجيه تطبيق Capacitor إلى صفحة تسجيل الخروج في Logto. سيتم إعادة التوجيه تلقائيًا إلى تطبيق Capacitor إذا تم تكوين URI إعادة التوجيه بعد تسجيل الخروج.
الآن يمكنك تكوين تدفق المصادقة في لوحة تحكم Logto السحابية دون كتابة كود معقد. سيتم تطبيق التكوين على جميع تطبيقات العملاء، مما يضمن تجربة مستخدم متسقة.
إذا واجهت أي مشاكل أثناء التكامل، لا تتردد في الاتصال بنا عبر البريد الإلكتروني على [email protected] أو الانضمام إلى سيرفر Discord الخاص بنا!