localStorage مقابل sessionStorage مقابل ملفات تعريف الارتباط - مقارنة مفصلة

كانت ملفات تعريف الارتباط معنا لفترة طويلة (كان Internet Explorer v2 يدعمها في أكتوبر 1995). لا يوجد شيء خاطئ معهم ، وقد جعلوا الويب بالتأكيد مكانًا أكثر متعة ، ولكن بعد ما يقرب من 25 عامًا تغير الكثير.

التخزين المحلي (ستجده ضمن Web Storage على W3) هو وليس بديلاً لملفات تعريف الارتباط. هذا هو الشيء الأكثر إرباكًا في الأمر. في معظم الحالات ، يمكنك استخدام localStorage بأمان بدلاً من ملفات تعريف الارتباط والحصول على انطباع (خاطئ) بأنهم متماثلون ، بينما هم ليسوا كذلك. تابع القراءة لمعرفة تفاصيل تفصيلية عن كيفية ووقت استخدام LocalStorage لاستبدال ملفات تعريف الارتباط.

ثورة أم تطور؟

التخزين المحلي ، أو التخزين المحلي ، أو تخزين DOM أو تخزين الويب (أنا لا أقوم بإنشاء هذه الأسماء ؛ جميعها قيد الاستخدام ، وكلها تشير إلى نفس الشيء) تم اعتمادها في العالم الحقيقي بين المتصفحات الشائعة في عام 2012 كـ "HTML5" خاصية". بدا وكأنه بديل هبة من السماء لملفات تعريف الارتباط. إصلاح للطلبات المتضخمة التي تحمل بيانات غير ضرورية في كل قيود الوقت والحجم. على الرغم من أنه "يحل" تلك المشكلات ، إلا أنه ليس بديلاً لملفات تعريف الارتباط من التفاح مقابل التفاح.

وبينما نحن في موضوع البيانات غير الضرورية. هل تعلم أن الطلبات ليست هي الشيء الوحيد الذي يمكن أن يكون له سخام غير ضروري ، يمكن لموقعك أيضًا. لحسن الحظ ، هناك حل يسمى WP Reset.

WP Reset هو مكون إضافي يأتي مع مجموعة من خيارات إعادة التعيين التي ستمكنك من القيام بأشياء مثل إزالة البيانات المتراكمة و / أو الوظائف الإضافية (المكونات الإضافية والسمات والمستخدمين والأدوات والمحتوى وما إلى ذلك) من موقعك ، و حتى مسح موقعك بالكامل نظيفًا. مدهش ، أليس كذلك؟ لكن هذا ليس كل شيء. من بين الميزات الأخرى ، يمكن لهذا المكون الإضافي إنشاء لقطات لقاعدة البيانات بالإضافة إلى مجموعات المكونات الإضافية والقوالب التي يمكنك تثبيتها بنقرة واحدة عدة مرات كما تريد. بالتأكيد أداة تستحق المراجعة.

لكن الآن ، دعنا نعود للحديث عن localStorage.

كما يوحي الاسم ، يتم تخزين البيانات محليًا على جهاز المستخدم. ومن ثم لا يتعين نقله عبر الشبكة مع كل طلب HTTP يقلل من المساحة ويعطينا مساحة أكبر لحفظ البيانات. هذا النموذج "المحلي فقط" هو أهم فرق بين ملفات تعريف الارتباط والتخزين المحلي. يمكن قراءة ملفات تعريف الارتباط من جانب الخادم ومن جانب العميل ، والتخزين المحلي فقط من جانب العميل. هذا كل ما في الامر. إذا كان تطبيقك يعتمد بشكل كبير على قراءة ملفات تعريف الارتباط من جانب الخادم وإنشاء محتوى بناءً عليه ، فإن التبديل إلى التخزين المحلي سيعني إعادة كتابة التطبيق. إذا كنت تستخدم ملفات تعريف الارتباط فقط لتخزين الإعدادات مثل علامة التبويب النشطة في الواجهة ، فإن التخزين المحلي هو البديل المثالي.

الخداع مماثلة

يقدم الجدول أدناه نظرة ثاقبة للاختلافات وحالات الاستخدام لملفات تعريف الارتباط والتخزين المحلي وتخزين الجلسة. بينما يمكنك إلقاء نظرة سريعة عليها للحصول على الإجابة التي تحتاجها والمغادرة ، فإنني أوصي بقراءة الحواشي الطويلة إلى حد ما التي تدخل في مزيد من التفاصيل. نعم ، أعلم أنك مشغول وترغب في مشاهدة فيديو القط التالي ، لكن الأشياء ليست بالأبيض والأسود ، لذا فإن الحفر أعمق قليلاً سيفيدك.

التعمق أكثر في تخزين الويب وملفات تعريف الارتباط

يعتمد الحد الأقصى من البيانات التي يمكنك تخزينها محليًا على المتصفح. لا توجد ضمانات ، وإذا كنت تريد رهانًا آمنًا ، فانتقل إلى أقل من 5 ميغابايت إلى حوالي 2 ميغابايت. استخدم هذه الأداة المفيدة لاختبار الحد الأقصى لحجم التخزين المحلي المسموح به في متصفحك.

إنه سيناريو شائع للمستخدمين لحظر الطرف الثالث أو جميع ملفات تعريف الارتباط . تنطبق نفس القاعدة على التخزين المحلي. لا توجد ضمانات ، ويجب أن يعمل تطبيقك (أو على الأقل عدم كسره) في بيئة لا يتوفر فيها التخزين المحلي.

تنتهي صلاحية جميع ملفات تعريف الارتباط في وقت ما ، ولكن يميل الأشخاص إلى تعيين مدى الحياة على بضع سنوات ، وهو ما يبدو إلى الأبد في وقت الإنترنت. من ناحية أخرى ، لا تنتهي صلاحية التخزين المحلي أبدًا وهو متاح حتى يحذفه التطبيق أو المستخدم. يتم التخلص من تخزين الجلسة عند إغلاق علامة التبويب أو النافذة - بدون استثناءات.

"ماذا تقصد أن الأوتار فقط يمكن أن تخلص ؟ أحفظ الأشياء طوال الوقت! " يمكّنك JSON من حفظ الكائنات وأنواع البيانات الأخرى في شكل سلسلة. التحويل يتم على القراءة والكتابة دون علمك. مع مكتبة الصوت للتعامل مع ملفات تعريف الارتباط والتخزين المحلي ، لن تضطر إلى التفكير في أنواع البيانات. ومع ذلك ، فإن هذا لا يغير حقيقة أن السلاسل فقط مدعومة محليًا.

لا توجد ميزة واحدة من جانب العميل تدعمها جميع المتصفحات . إنها حقيقة محزنة ، لكنها لا تزال حقيقة. يمكنك التحقق من وجود أرقام محددة على Can I Use ولكن فيما يتعلق بملفات تعريف الارتباط والتخزين المحلي ، سأتجاهل جميع المتصفحات التي لا تدعمها. هم هامشيون وأقل من 1٪.

لا يمكنك الوصول إلى localStorage عبر المعالجة من جانب الخادم فقط. أنت بحاجة إلى JS أيضًا. عندما يطلب المستخدم صفحة ويبدأ PHP (أو أي لغة من جانب الخادم تستخدمها) لإنشائها ، فلن يكون لديك حق الوصول إلى أي بيانات محلية أو جلسة أو دائمة. بمجرد تحميل الصفحة وبدء تشغيل JS ، يمكنك الوصول إلى البيانات المحلية والقيام بكل ما تحتاجه - اضبط واجهة المستخدم أو استخدم AJAX لإرسال البيانات المحلية مرة أخرى إلى الخادم. لذا ، نعم ، يمكنك إعادة البيانات المحلية إلى الخادم ولكن ليس بنفس الطريقة واللحظة التي تستخدمها مع ملف تعريف الارتباط. اعتمادًا على متطلباتك ، قد يكون هذا بمثابة كسر للصفقة عندما يتعلق الأمر بالتبديل من ملفات تعريف الارتباط إلى التخزين المحلي ، لذا ، يرجى - التخطيط مسبقًا!

باستخدام التخزين المحلي ، لا يتم نقل أي بيانات بين العميل والخادم (ما لم يكن هناك رمز يفعل ذلك صراحة). إنه رائع لتقليل حجم الحمولة. من ناحية أخرى ، يتم نقل ملفات تعريف الارتباط كحقل رأس HTTP مع كل طلب على النطاق المحدد. لا يمكن تغييره أو إيقاف تشغيله بشكل انتقائي.

"لا ينبغي" للمستخدمين الوصول إلى البيانات المحلية وتغييرها مباشرة (خارج التطبيق الخاص بك) ولكن لا شيء يمنعهم من القيام بذلك. هناك العديد من أدوات التصحيح المتاحة لتحرير البيانات المخزنة محليًا. لذلك لا تثق في البيانات المحلية أو تفترض أن المستخدم لم يلمسها. افترض دائما الأسوأ.

بينما تحتوي ملفات تعريف الارتباط على سمة "آمنة" يمكنك تعيينها ، فإن ذلك لا يحمي ملف تعريف الارتباط أثناء انتقاله من التطبيق إلى المتصفح. لذلك فهو أفضل من لا شيء ولكنه أبعد ما يكون عن الأمان. التخزين المحلي ، كونه تقنية من جانب العميل فقط لا تعرف أو تهتم إذا كنت تستخدم HTTP أو HTTPS. يجب أن يأتي الأمان من الطريقة التي تتعامل بها مع البيانات. لا تقم بتخزين أي بيانات حساسة مثل أرقام بطاقات الائتمان أو كلمات المرور بأي شكل من أشكال التخزين المحلي! أبدًا!

القليل من التعليمات البرمجية لتبدأ

لا يُقصد من هذه المقالة أن تكون برنامجًا تعليميًا لتخزين الويب JavaScript ولكن لتوفير المشكلة ، إليك مثال Hello World مع التخزين المحلي ؛

// store a value
localStorage.setItem( 'name', 'John' );

// retrieve a value
localStorage.getItem( 'name' );

// remove the value
localStorage.removeItem( 'name' );

// only string values can be stored so for objects, use JSON
var post = {
  title: 'Cookies are old',
  author: 'Gordan'
}
localStorage.setItem( 'post', JSON.stringify( post ) );

// and to retrieve
var post = JSON.parse( localStorage.getItem( 'post' ) );

يعمل الكود أعلاه ، وهو بسيط قدر الإمكان. ومع ذلك ، لا أوصي باستخدامه. كما هو الحال مع ملفات تعريف الارتباط ، لا أحد يستخدم ملفات تعريف الارتباط document.cookies للتفاعل معها. هناك اختلافات طفيفة بين المستعرضات يجب أخذها في الاعتبار ، وبما أنها تخزن السلاسل فقط ، فيجب عليك التشديد والتحليل باستخدام JSON في كل قراءة وكتابة. لهذا السبب نستخدم مكتبات صغيرة لمساعدتنا في التعامل مع ملفات تعريف الارتباط مثل js-cookie. الشيء نفسه ينطبق على التخزين المحلي. سيساعد وضع طبقة تجريد صغيرة بين الكود الخاص بك وواجهة برمجة التطبيقات على المدى الطويل. أوصي بـ store.js. لقد كان موجودًا لفترة من الوقت ، وهو يعتني بالهراء عبر المستعرضات والنسخ الاحتياطية وحتى أنه يحتوي على مكونات إضافية مفيدة تعمل على توسيع ميزاته. إذا كنت مهتمًا ببعض ممارسات البرمجة ، فأنشئ مكتبتك الخاصة وقم بتحويلها إلى مكون jQuery الإضافي.

ملفات تعريف الارتباط سيئة ، أليس كذلك؟ نحن بحاجة إلى شيء جديد!

ملفات تعريف الارتباط ليست سيئة. لقد كانوا يخدمون غرضهم منذ عقود وسيواصلون القيام بذلك لأن التخزين المحلي ليس بديلاً "للتفاح مقابل التفاح". ومع ذلك ، تظهر ملفات تعريف الارتباط علامات الشيخوخة. بصرف النظر عن ذلك ، فإن بعض عيوب التصميم الخاصة بهم لن تختفي في أي وقت قريب أيضًا. وهي "تلويث" كل طلب على النطاق بحمولة ملفات تعريف الارتباط وحجم الحمولة الصافي الصغير.

ملفات تعريف الارتباط غير كافية وقديمة أم لا ، لذا لا تعتقد أن التخزين المحلي سيتولى أمره بالكامل في أي وقت قريب. ومع ذلك ، في بعض حالات الاستخدام ، يكون التخزين المحلي بلا شك خيارًا أفضل.

إذا كان لديك (الكثير) من البيانات لتخزينها من جانب العميل والتي نادرًا ما يتم نقلها إلى الخادم ولا تحتوي هذه البيانات على أي شيء حساس - ابدأ في استخدام التخزين المحلي ! إنه بالضبط ما تم إنشاؤه من أجله. ستنشئ تطبيقًا أسرع عن طريق جعل جميع طلبات HTTP على النطاق أخف وزناً والحصول على هذا الشعور الغامض الدافئ باستخدام شيء جديد.