سؤال

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

كيف يمكنني الذهاب حول تخزين البيانات المستمرة على جانب العميل؟

هل كانت مفيدة؟

المحلول

يمكنك تخزين البيانات في window.name, ، والتي يمكن أن تصل إلى 2 ميغابايت من البيانات (!).

/* on page 1 */
window.name = "Bla bla bla";

/* on page 2 */
alert(window.name); // alerts "Bla bla bla"

يحرر: أيضا إلقاء نظرة على هذه المادة AJAXIAN فيما يتعلق بهذا.

لاحظ أن المواقع الأخرى في نفس علامة التبويب / نافذة لا تملك أيضا الوصول إلى window.name, ، لذلك يجب أن لا تخزين أي شيء سري هنا.

نصائح أخرى

يمكنك استعمال ال واجهة برمجة تطبيقات تخزين الويب (Window.localStorage أو Window.sessionStorage). الدفع هذه المقالة على HTML5Doctor للحصول على تفسير أكثر متعمقة. ال واجهة برمجة تطبيقات تخزين الويب يكون بدعم من جميع المتصفحات الحديثة عند هذه النقطة.

تسمح لك خاصية Localstorage للقراءة فقط بالوصول إلى كائن تخزين لأصل المستند؛ يتم حفظ البيانات المخزنة عبر جلسات المتصفح. وبعد موقع Localstorage يشبه Sessionstorage، باستثناء ذلك أثناء وجود البيانات المخزنة في LocalStorage ليس لها وقت انتهاء الصلاحية، يتم مسح البيانات المخزنة في SessionStorage عند انتهاء جلسة الصفحة - أي عندما يتم إغلاق الصفحة.
https:/developer.mozilla.org/en/docs/web/api/window/localstorage.

كما هو موضح أعلاه:

  • لتخزين البيانات إلى أجل غير مسمى (حتى يتم مسح ذاكرة التخزين المؤقت)، استخدم Window.localStorage.
  • لتخزين البيانات حتى يتم إغلاق النافذة، استخدم Window.sessionStorage.

هناك طريقتان من الإعداد والحصول على خصائص عبر Window.localStorage و Window.sessionStorage API:

  1. الوصول إلى الخصائص مباشرة:

    localStorage.name = 'ashes999';
    console.log(localStorage.name); // ashes999
    delete localStorage.name;
    console.log(localStorage.name); // undefined
    
    sessionStorage.name = 'ashes999';
    console.log(sessionStorage.name); // ashes999
    delete sessionStorage.name;
    console.log(sessionStorage.name); // undefined
    
  2. استخدم ال Storage.setItem, Storage.getItem, ، و Storage.removeItem أساليب API.

    localStorage.setItem('name', 'ashes999');
    console.log(localStorage.getItem('name')); // ashes999
    localStorage.removeItem('name');
    console.log(localStorage.getItem('name')); // undefined
    
    sessionStorage.setItem('name', 'ashes999');
    console.log(sessionStorage.getItem('name')); // ashes999
    sessionStorage.removeItem('name');
    console.log(sessionStorage.getItem('name')); // undefined
    

تحفظات:

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

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

ماذا عن Google Gears. وهي مصنوعة للتخزين دون اتصال، لكنني أعتقد أنه قد يعمل.http://code.google.com/apis/gears/design.html.

من الوثائق:

تخزين بيانات المستخدم

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

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

تتمثل ميزة إضافية في قاعدة بيانات التروس في البحث عن النص الكامل، مما يوفر طريقة سريعة للبحث عن نص ضمن ملف قاعدة بيانات. قراءة التفاصيل هنا.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top