سيظهر لك هذا الدليل كيفية المصادقة باستخدام Logto في اختبارات تطبيق الويب أحادي الصفحة (SPA).
المصادقة هي جزء حيوي من أي تطبيق ويب، ومن الضروري التأكد من أن حواجز المصادقة تعمل كما هو متوقع في تطبيقات الصفحات الفردية (SPAs). في هذا الدليل، سنرشدك خطوة بخطوة خلال عملية المصادقة باستخدام Logto في اختباراتك باستخدام Cypress، مما يتيح لك اختبار تدفق المصادقة لتطبيقك SPA بفعالية.
قبل البدء، تأكد من توفر الآتي لديك:
حساب Logto. إذا لم يكن لديك واحد، يمكنك التسجيل في Logto السحاب مجانًا.
تطبيق صفحة واحدة (SPA) يستخدم Logto للمصادقة. إذا لم يكن لديك واحد، يُرجى اتباع دليلنا إنشاء ودمج التطبيق الأول، وإنشاء وتسجيل تطبيق جديد في Logto.
دمج Logto مع تطبيقك الـ SPA باستخدام حزمة تطوير البرمجيات الجاهزة لدينا. على سبيل المثال React SDK
يمكنك اتباع دليلنا تجربة تسجيل الدخول لتخصيص تجربة تسجيل الدخول لتطبيقك الـ SPA. وقم بمحاكاة تدفق تسجيل الدخول في اختبارات Cypress الخاصة بك وفقًا لذلك.
إكمال تثبيت Cypress والتكوين. يفترض هذا الدليل أن لديك بيئة Cypress معدة بشكل جيد وأنك قادر على تشغيل اختبارات Cypress الخاصة بك بالفعل.
تشغيل خدمة Logto وتطبيق العميل.
سنستخدم في هذا الدليل مثالاً لتطبيق React SPA Sample. يمكنك العثور على الشفرة المصدرية هنا. إنه تطبيق React بسيط يستخدم Logto مع Logto React SDK للمصادقة.
http://localhost:3001/sign-inhttp://localhost:3000username/passwordلنكتب أمرًا مخصصًا لـ Cypress للمصادقة باستخدام Logto في اختبارات Cypress الخاصة بك. باستخدام الأمر المخصص، يمكنك المصادقة بسهولة مع Logto في أي من اختبارات Cypress الخاصة بك.
زيارة صفحة تسجيل الدخول لتطبيق العميل في اختبار Cypress، وبدء تدفق تسجيل الدخول بالنقر على زر تسجيل الدخول.
الانتقال إلى صفحة تسجيل الدخول لـ Logto، وملء اسم المستخدم وكلمة المرور لتسجيل الدخول.
في الاستخدام العادي، يمكن لاختبار Cypress واحد تشغيل الأوامر في أصل واحد فقط، وهو قيد تحدده ميزات أمان الويب القياسية للمتصفح. يسمح لك أمر cy.origin() باختباراتك تجاوز هذا القيد.
بعد تسجيل دخول ناجح، يجب أن تكون قادرًا على العودة إلى تطبيق العميل الخاص بك.
تلخيص تدفق تسجيل الدخول بالكامل كأمر مخصص لـ Cypress. cy.signIn في هذا المثال.
في أي من اختبارات Cypress الخاصة بك، يمكنك استخدام الأمر المخصص لـ Cypress للمصادقة باستخدام Logto.
تهانينا! لقد نجحت في المصادقة باستخدام Logto في اختبارات Cypress الخاصة بك. يمكنك الآن التركيز على اختبار تطبيقك الـ SPA دون القلق حول تدفق المصادقة.