كيفية إعادة توجيه المستخدم إلى صفحة أخرى بعد تسجيل الدخول باستخدام JavaScript Fetch API؟ باستخدام استجابة إعادة توجيه ، سيتم اتباع إعادة التوجيه تلقائيًا على جانب العميل. هذا لأنه تم تعيين وضع إعادة التوجيه للمتابعة افتراضيًا في وظيفة FETCH (). نتيجةً لذلك ، لن يتم إعادة توجيه المستخدم إلى عنوان URL الجديد ، بل سيتبع ذلك إعادة التوجيه وراء الكواليس وإعادة الاستجابة من عنوان URL إعادة توجيه.

للتغلب على ذلك ، يمكنك التحقق من ما إذا كان الاستجابة هي نتيجة طلب قمت بتقديمه والذي تم إعادة توجيهه. إذا كان الأمر كذلك ، فيمكنك استرداد خاصية عنوان URL للاستجابة ، والتي ستعيد عنوان URL النهائي الذي تم الحصول عليه ** بعد ** أي إعادة توجيه ، واستخدام نافذة JavaScript.Location.href ، يمكنك إعادة توجيه المستخدم إلى عنوان URL المستهدف (أي ، إعادة توجيه الصفحة). بدلاً من window.location.href ، يمكن للمرء أيضًا استخدام window.location.replace (). الفرق من إعداد قيمة خاصية HREF هو أنه عند استخدام طريقة الموقع. الفصل () ، بعد التنقل إلى عنوان URL المحدد ، لن يتم حفظ الصفحة الحالية في سجل الجلسة - ومع ذلك ، فإن المستخدم لن يتمكن من استخدام الظهر زر للتنقل إليه.

رمز مثال: E.PreventDefault () ؛ // إلغاء الإجراء الافتراضي var formelement = document.getElementById ("myform") ؛ var data = formData جديد (formelement) ؛ جلب ("http: // my-server/login" ، { الطريقة: "بعد" ، إعادة التوجيه: "اتبع" ، / / قم بتغييره إلى "يدوي" إذا كنت ترغب في التعامل مع إعادة التوجيه يدويًا الجسم: البيانات ، }) .Then ((res) => { if (res.redired) { window.location.href = res.Url ؛ // أو ، location.replace (res.Url) ؛ يعود؛ } آخر { Return Res.Text () ؛ } }) .Then ((data) => { document.getElementById ("الاستجابة"). innerhtml = data ؛ }) .catch ((خطأ) => { console.error (خطأ) ؛ }) ؛ }) ؛

ملاحظة:

رأس. وذلك لأن رؤوس الاستجابة المسلحة فقط يتم تعريضها افتراضيًا.