كل المنشورات / React وNext.js / №01
لماذا لا تُعدَّل الـ cookies في Next.js إلا من Server Actions؟
عند نقل المصادقة إلى السيرفر ظهر خطأ يمنع تعديل الـ cookies. السبب أن الـ cookies تتغيّر عبر ترويسة Set-Cookie في الاستجابة، فلا يغيّرها إلا كود يُرجع استجابة إلى المتصفح.
وأنا عم اشتغل على Server-Side Authentication بمشروع Next.js، كنت بخزّن الـ tokens باستخدام cookies.
لما نقلت الـ auth ليصير Server Side، طلعلي هالـ Error اللطيف 👇
Cookies can only be modified in a Server Action or Route Handlerاستغربت شوي…
ليش بس Server Actions أو Route Handlers؟ 🤔
بحثت بالمشكلة، واكتشفت شغلة صادمة شوي:
أنا ما كنت فهمان الـ cookies منيح 😅
خلينا نرجع خطوة لورا 👇
الـ cookies بتتخزّن جوات الـ browser، وبتختلف عن localStorage إنو التعامل معها مو مباشر.
تعديل الـ cookies ما بيصير من JavaScript مباشرة،
بل بيصير عبر HTTP Response من السيرفر باستخدام header اسمه:
Set-Cookieيعني ببساطة:
- السيرفر بيرسل
Set-Cookie - الـ browser بيستقبل الـ response
- وبيحدّث الـ cookies عنده
وهون كانت المشكلة:
أنا كنت عم حاول أخلّي كود Server Side يغيّر cookies بدون ما يكون في request/response راجع للـ browser.
وطالما ما في response:
👉 الـ browser ما بيشوف شي
👉 والـ cookies ما بتتغير
وهون فهمت ليش Next.js حصر هالعملية بـ: Server Actions و Route Handlers
لأن هدول الوحيدين اللي:
- بينفذوا على السيرفر
- بينطلقوا من client request
- وبيرجعوا response حقيقي للـ browser
بهاللحظة حسّيت قديش عالم الويب أعمق مما كنت متوقع،
وقديش في مفاهيم منستخدمها يوميًا بدون ما نعرف شو عم يصير بالأعماق 😄