في الـ Web Development فيه مشكلة بتقابلنا الا وهي ان الـ HTTP بطبعه بيكون Stateless يعني مش بيحتفظ بأي بيانات , وعشان نعالج المشكلة دي ونخلي فيه State موجودة نقدر من خلالها ندير البيانات ونخزنها , ظهر الـ Cookies والـ Sessions
فهما أدوات أساسية لإدارة البيانات وتخزينها أثناء تفاعل المستخدمين مع المواقع, بالرغم من تشابههم في بعض الجوانب، إلا أن كل واحد منهم ليه استخدامات وخصائص مميزة. هنشرح بالتفصيل الفرق بينهم وامتى بنستخدم كل واحد فيهم
الـ Cookies
الـ Cookie هي ملف نصي صغير بيتم تخزينه في جهاز المستخدم (زي الكمبيوتر أو الموبايل) بواسطة المتصفح. الهدف الرئيسي من الـ Cookie هو تخزين معلومات بسيطة بتساعد الموقع في تذكر المستخدم والتفضيلات بتاعته.
استخدامات الـ Cookies
الـ Cookies ليها استعمالات كتير من ضمنهم:
تسجيل الدخول: المواقع بتستخدم الـ Cookies علشان تفتكر المستخدمين المسجلين وتوفر عليهم عناء تسجيل الدخول كل مرة.
تتبع النشاط: المواقع بتستخدم الـ Cookies لتتبع سلوك المستخدمين وتحليل نشاطهم لتحسين الخدمات والإعلانات.
تخصيص المحتوى: بتساعد الـ Cookies في تخصيص تجربة المستخدم عن طريق تذكر تفضيلاته، زي اللغة المفضلة أو ثيم الموقع.
مدة تخزين الـ Cookie
فيه نوعين من الـ Cookies الا وهم الـ Session Cookie والـ Persistent Cookie وكل واحد فيهم بتختلف مدة تخزينه عن التاني:
Session Cookies: بتنتهي بمجرد ما المستخدم يقفل المتصفح.
Persistent Cookies: بتفضل موجودة لفترة محددة بيحددها المطور، وبتنتهي أوتوماتيك بعد المدة دي.
Thanks for reading Eqraatech Newsletter! Subscribe for free to receive new posts and support my work.
HTTP Short Polling, Long Polling and SSE
انهاردة هنتكلم عن 3 من التقنيات المهمة جدًا واللي مهم جدًا نكون عارفين الفرق بينهم اثناء تصميم Realtime Web Applications والـ 3 تقنيات دول هم الـ Long Polling , Short Polling , Server-Sent Events.
الـ Web Applications في الأساس مبنية على فكرة بسيطة الا وهي الـ Client - Server Model واللي بدوره الـ Client بيبعت Request للـ Server والـ Server يعمل Processing للـ Request ويرجع الـ Response للـ Client.
ومع تطور تطبيقات الـ Web واللي بدورها أصبحنا في احتياج أكتر للتطبيقات اللي متطلبة تحديثات دورية بتحصل بشكل فعلي يعني Realtime Applications , كان لازم نحاول نفكر بشكل مختلف في طريقة تسمحلنا نهيئ من خلالها الـ Client - Server Model اللي متعودين عليه .
فخلونا نشوف مع بعض الـ 3 تقنيات اللي جم عشان يحلوا المشكلة دي , ونتناقش في مميزات وعيوب كل تقنية منهم ونشوف امتة نستعملها , واحنا كنا اتكلمنا قبل كده في ورقة عن تقنية الـ WebSockets فتقدروا تشوفوها من خلال الرابط ده :
الـ HTTP Short Polling
الـ HTTP Short Polling فكرته ببساطة عاملة زي اكنك بتكلم واحد صاحبك كل شوية تسأله عن موضوع معين مستني تعرف منه ايه اللي حصل فيه , فكل شوية تكلمه تقوله : هاا ؟ فيه اخبار جديدة ؟ ولا لسه ؟ وانت وحظك يا هيكون فيه اخبار جديدة يا مفيش .. وترجع تكلمه بعد شوية وتكرر نفس الموضوع ..
فالـ Client بيبعت Request للـ Server كل ثانية أو ثانيتين على سبيل المثال بشكل دوري وزي ما شوفنا ممكن الـ Server يرد عليه بـ Response فاضي عادي جدًا لو مفيش أي اخبار جديدة.
طيب عيوب الموضوع ده ايه ؟
عيوب الـ HTTP Short Polling
HTTP Overhead : وده لان زي ما شايفين الـ Client بشكل دوري بيفضل يبعت HTTP Requests للـ Server كل شوية , واللي بدوره بيستهلك Resources عشان بيفتح Connection وبيتضمن Headers معينة
مش مناسب للتطبيقات اللي محتاجة تكون فعلا Realtime وده لانه ميعتبرش Real-time اوي لان ممكن التغييرات تحصل في الفترة الزمنية اللي بعد مالـ Client يكلم فيها الـ Request ويرد عليه بانه مفيش أي جديد
مميزات الـ HTTP Short Polling
بسيط وسهل التنفيذ في التطبيقات ومش محتاج أي تعقيدات
مش هيتطلب أن يكون فيه Server بامكانيات معينة ومتطور عشان يحقق ده ومش هيتطلب تعديلات من وقت للتاني
طيب دي كانت أول تقنية تعالوا نشوف مع بعض تقنية الـ Long Polling
استعمالات الـ HTTP Short Polling
التطبيقات اللي مش محتاج تكون فيها البيانات Realtime بشكل فعلي زي الأخبار والتحديثات الدورية , اللي ممكن يكون فيها نسبة تأخير
HTTP Status Codes Cheat Sheet
اتكلمنا قبل كدا عن ايه هي ال Http status codes وليه مهمة في تصميمنا لـ APIs , النهارده هنتكلم عن أشهر 15 status code منهم وعاملين cheat sheet بيهم تقدر تساعدك في انك تفتكر استخداماتهم سريعًا في وقت الشغل.
Success Codes 2xx
1- 200 OK
يعبر عن تنفيذ ال request و ايصاله لل client بنجاح
2- 201 Created
يستخدم هذا الكود ليعبر عن إنشاء resource جديد بنجاح
و يستخدم مع ال POST Method ويمكنك أن تعيد معه أيضَا ال resource ID
3- 202 Accepted
يعبر عن قبول الطلب بنجاح ولكنه لا يزال قيد التنفيذ على ال server , ويمكنك أن تستخدم هذا الكود حينما يفوض السيرفر الطلب لسيرفر أخر أو background task قد تستغرق وقتًا
Redirect Codes 3xx
4- 301 Moved Permanently
عندما تقوم بتغيير ال URL يمكنك أن تستخدم هذا الكود لتوضح أنه قد تم نقل الAPI لعنوان جديد بدلاً من العنوان المستخدم في هذا الطلب وفي ال response body تضع العنوان الجديد ليتم استخدامه فيما بعد.
HTTP/1.1 301 Moved Permanently
Location: https://example.com/new-location
Content-Type: text/html
5- 302 Found (Moved Temporarily)
يستخدم هذا الكود في حالة تغيير عنوان ال API لعنوان آخر بشكل مؤقت لعمل صيانة أو تحديث لل API علي هذا العنوان, يقوم ال client بعمل redirect للعنوان المؤقت الجديد و لكن فيما بعد يستطيع العودة لاستخدام ال URL القديم.
6- 304 Not Modified
يستخدم هذا الكود في حالة ال conditional GET حيث يتم إرسال if-modified-since بداخل الـ request headers فيجيب الserver بهذا الكود كي يعلم ال client بأن الـ resource لم يتغير ويمكن لل client استخدام النسخة التي لديه في الـ cache.
ايه النشرة الأسبوعية الجميلة دي 🎉