الحفاظ على سلامة البيانات عبر صفحات HTML في JavaScript

عند نقل البيانات بين صفحات الويب، النهج التقليدي لاستخدام معلمات الاستعلام (على سبيل المثال، "http://localhost/" project/index.html?status=exist") يمكن أن يترك المعلومات الحساسة مكشوفة في عنوان URL. ولمعالجة هذا القلق، يبحث المطورون عن طرق بديلة لتبادل البيانات بشكل آمن.

أحد الحلول القابلة للتطبيق هو استخدام كائنات تخزين HTML5 مثل sessionStorage أو localStorage. توفر هذه الكائنات آلية قوية لتخزين أزواج القيمة الرئيسية محليًا، مما يتيح ثبات البيانات عبر صفحات متعددة.

تخزين الجلسة

للتخزين المؤقت خلال جلسة واحدة، يمكن الاستفادة من تخزين الجلسة. لتخزين البيانات باستخدام sessionStorage:

sessionStorage.setItem('label', 'value');

لاسترداد البيانات المخزنة:

sessionStorage.getItem('label');

التخزين المحلي

لمزيد من التخزين الدائم، يمكن استخدام التخزين المحلي. لتخزين البيانات باستخدام localStorage:

localStorage.setItem('label', 'value');

لاسترداد البيانات المخزنة:

localStorage.getItem('label');

يوفر هذا الأسلوب العديد من المزايا:

• البيانات الحماية: لا يتم الكشف عن المعلومات الحساسة في عنوان URL.
• الاستمرارية: تظل البيانات متاحة حتى بعد إعادة تحميل الصفحة أو إغلاق المتصفح.
• Cross- إمكانية الوصول إلى الصفحة: يمكن الوصول إلى البيانات المخزنة من أي صفحة داخل نفس المجال.