C I S T E A M

Web Storage

Blog Image

Web Storage

جربت تملي فورم وتعمل Submit بس الـ Browser هنج واضطريت تعمل Reload يمكن يتضبط!


بعدها ظهرت الفورم فاضية وهتمليها من الأول تاني 🥲 


طيب جربت تغير لون صفحة على موقع أو تغير اللغة بتاعتها للغة العربية مثلًا!


بس في الحالة دي لو دوست على أي لينك في الصفحة دي وفتح لي صفحة تانية هتكون باللغة العربية بردو زي ما اخترت قبل كدا.


أكيد هتسأل ليه في الأول ما احتفظش ببيانات الفورم زي ما احتفظ باللغة كدا ؟! 🤔 


عشان ببساطة الـ Web Page مش بتحتفظ بالبيانات دي لوحدها.. تعالى نعرف أي الـ بيحصل 😌


في البداية عندنا حاجة اسمها Web Storage API (Application Programming Interface)..


إيه هو الـ API دا وإيه هدفه؟


هو Function بتعمل وظيفة معينة وهي تبادل Data بيني وبين App تاني.


ازاي!.. يعني ممكن برنامج شغال Java غيره شغال Payton غيره ++C يفهموا بعض!!


اه عادي ودا بسبب أن الـ Data اللي بتتنقل بتستخدم حاجة Standard على كل الـ Platform زي XML5 , JSON.


وأي لغة في الدنيا تقدر تفهمهم كمان 😌


بس هدفه إخفاء التفاصيل وبيعملها "Encapsulation" بمعني أنه بيغلفها زي الكبسولة كدا بتاخدها بس ما تعرفش جواها إيه لكن لها جرعة معينة ومواعيد.. فـ API بيقدم لي الحاجة من غير ما أهتم هي اتعملت ازاي بس ههتم أتعامل معاها ازاي.


عشان كدا فيه أمثلة كتير في حياتنا عن الـ API


زي الـ Facebook بنفتحه كل يوم وطول الوقت.. لكن عملنا تسجيل دخول مرة واحدة بس


دا كان بسبب الـ API بيوفره Facebook للمواقع 


كدا عرفنا معلومات بسيطة عن الـ API .. طيب في أنواع كمان للـ Storage وهي: -


1- Session Storage:


في الحالة دي بيحتفظ بمساحة التخزين منفصلة لكل مصدر، بتكون متاحة طول ما الـ Browser مفتوح.


ممكن نشبهها أننا بنحضر سيشن في إيڤنت مثلًا.. لما بتخلص بنقوم نمشي والـ Speaker دوره بينتهي.


فهنا أول ما نقفل الـ Browser البيانات اللي اتخزنت دي هتتمسح أو دورها هينتهي 😌


2-Local Storage:


هي نفس الـ Session لكن بتستمر عادي حتى لو الـ Browser اتقفل وفتحته تاني بعد يوم، شهر أو حتى سنة.


بس هنتكلم عن حاجة تانية شائعة جدًا في الـ Storage بردو وهي الـ Web Cookies 🍪😋


لو كنت زورت موقع علي النت قريب من المحتمل أنك شوفت إشعار من Cookies  😌


تعالي نشوف إيه هي وبتعمل إيه وإيه فايدتها 🏃🏻‍♂️


هي مجموعة صغيرة من الـ Data بتراقب الـ Users عشان تعرف معلومات عنهم وعن المواقع اللي بيزوروها..


أو ممكن نقول إنها رسالة الـ server بيديها للـ Browse.


فالسيناريو بيمشي كالتالي لما أزور أي موقع:


• الـ Browser بتاعي بيخزن كل رسالة في ملف صغير اسمه Cookie.txt.


• الـ Files دي بيبقي فيها كل المعلومات عن زيارتي للـ Web Page دي وأما أروح علn أي Web Page تانية الـ Browser بيبعت الـ Cookie دي تاني للـ Server فيقدر يجمع معلومات عن الـ Web Pages الأكثر استخدامًا وإيه أكتر الصفحات اللي بيتم زيارتها دايمًا.


• الـ Server كمان بيستخدم الـ Cookies عشان يقدم لي Web Page شخصية.. بمعنى أن أما أزور أي موقع وأختار بعض الحاجات الـ Favorite ليا


الـ Server بيستخدم اختياراتي دي في أنه ياخد كل المعلومات دي عني ويحطها في File، بحيث أما أزور الموقع تاني الـ Server يستخدم المعلومات دي عشان يبني Page ليا.


دا أدى إلى أن الـ Online Stores تستغل الـ Cookies في الـ Online Shopping 🛒


عندنا نوعين من الـ Cookies: -


1- Session Cookies:


هي عبارة عن Cookie بتتمسح لما أقفل الـ Browser بتاعي لأنها بتتخزن في ذاكرة مؤقتة.


2- Persistent Cookies:


هي عبارة عن Cookie دائمة اللي بتتخزن على الـ Hard Drive لحد انتهاء صلاحيتها أو حتى حذفها.


إيه دا يعني المعلومات اللي بسجل بيها بتروح فين ومين بيشوفها! 😮


هو فيه Security خاصة بـ Cookies..


الموقع اللي بيصنع Cookie هو الوحيد اللي يقدر يقرأها ويقرأ المعلومات اللي فيها، يعني أي Servers تانية ما تقدرش تعرفها.


بس طبعاً كل حاجة ليها سلبيات.. من أكبر قضايا الـ Cookies متعلقة بالخصوصية والأمن 😢

لأن الـ Cookies تقدر تعرف معلومات ونشاطات الـ User على النت ممكن أي طرف تالت يوصل للمعلومات دي ويستخدمها بشكل عدواني، أنهم يوصلوا للإيميل والباسورد بتاعك وأي معلومات عنك.. عشان كدا ناس كتير بتتجنبه.


ولكن تقدر تعرف الـ Cookies الخاصة بيك المخزنة على الـ Browser، تتحكم ازاي في المواقع اللي تقبل منها الـ Cookies، ممكن كمان تتحكم قد إيه الـ Cookies دي تتخزن أو تُستخدم من هنا:

https://kb.iu.edu/d/ahic


وبكدا نكون وصلنا لآخر المقال وعرفنا فيه بعض المعلومات عن موضوعنا 😌🌸