تخزين التطبيق HTML5

باستخدام تخزين التطبيق، يمكن إنشاء نسخة متاحة دون اتصال بالإنترنت بسهولة من خلال إنشاء ملف التفاصيل (cache manifest)。

ما هو تخزين التطبيق؟

أدخل HTML5 تخزين التطبيق (Application Cache)، مما يعني أنه يمكن تخزين تطبيقات الويب وتشغيلها دون وجود اتصال بالإنترنت.

يقدم التخزين المؤقت للمطالب ثلاثة مزايا لالتطبيق:

  1. تصفح غير متصل بالإنترنت - يمكن للمستخدمين استخدامها عندما تكون التطبيق غير متصلة بالإنترنت
  2. السرعة - يتم تحميل الموارد المحفوظة بسرعة أكبر
  3. تقليل تحميل الخادم - سيقوم المتصفح بتحميل الموارد التي تم تحديثها أو تغييرها فقط من الخادم

دعم المتصفحات

الرقم في الجدول يشير إلى إصدار المتصفح الذي يدعم حظيرة التطبيق بشكل كامل.

API
حظيرة التطبيق 4.0 10.0 3.5 4.0 11.5

مثال على HTML Cache Manifest

يُظهر المثال أدناه مستند HTML يحتوي على ملف المانيفست (للاستخدام عند عدم الاتصال بالإنترنت):

مثال

!DOCTYPE HTML
<html manifest="demo.appcache">
<body>
محتويات المستند ......
</body>
</html>

جرب بنفسك

أساس Cache Manifest

لتمكين حظيرة التطبيق، يُرجى تضمين خاصية manifest في علامة <html> من المستند:

!DOCTYPE HTML
<html manifest="demo.appcache">
...
</html>

يتم تخزين كل صفحة معينتها التي تم زيارتها من قبل المستخدم. إذا لم يتم تحديد خاصية المانيفست، لن يتم تخزين الصفحة (ما لم يتم تحديد الصفحة مباشرة في ملف المانيفست).

يُنصح بمدخل ملف المانيفست هو: ".appcache".

ملاحظة:يحتاج ملف المانيفست إلى إعداد نوع MIME الصحيح، وهو "text/cache-manifest". يجب إعداده على خادم الويب.

ملف المانيفست

ملف المانيفست هو ملف نصي بسيط، يخبر المتصفح عن المحتويات المحفوظة (وحتى المحتويات التي لا يتم تخزينها).

يكون ملف المانيفست مقسماً إلى ثلاثة أجزاء:

  • CACHE MANIFEST - في هذا العنوان، يتم تخزين الملفات المذكورة هنا بعد التحميل الأول.
  • NETWORK - في هذا العنوان، يتم تحديد الملفات التي تحتاج إلى اتصال بالخادم ولن يتم تخزينها.
  • FALLBACK - في هذا العنوان، يتم تحديد ملفات الاستبدال عندما لا يمكن الوصول إلى الصفحة (مثل الصفحة 404).

CACHE MANIFEST

السطر الأول، CACHE MANIFEST، هو ضروري:

CACHE MANIFEST
/theme.css
/logo.gif
/main.js

يُحدد الملف المانيفست أعلاه ثلاثة موارد: ملف CSS، صورة GIF، وملف JavaScript. عند تحميل ملف المانيفست، سيقوم المتصفح بتحميل هذه الثلاثة ملفات من مجلد جذور الموقع. ثم، مهما كان وقت انقطاع المستخدم عن الإنترنت، ستظل هذه الموارد متاحة.

NETWORK

الجزء التالي من NETWORK يحدد ملف "login.php" لن يتم تخزينه أبدًا في السجل، وسيكون غير قادر على الاستخدام عند عدم الاتصال بالإنترنت:

NETWORK:
login.asp

يمكن استخدام النجمة لتحديد أن جميع الموارد/الملفات الأخرى تحتاج إلى اتصال بالإنترنت:

NETWORK:
*
FALLBACK

يحدد جزء FALLBACK أدناه أنه إذا لم يتمكن من إقامة اتصال بالإنترنت، يتم استبدال جميع ملفات مجلد /html/ باستخدام "offline.html":

FALLBACK:
/html/ /offline.html

ملاحظة:الرابط الأول هو الموارد، والثاني هو البديل.

تحديث التخزين المؤقت

بمجرد أن يتم تخزين التطبيق، سيظل مخزنًا حتى يحدث ما يلي:

  • إزالة التخزين المؤقت للمستخدم
  • تم تعديل ملف المانيفست (انظر الإشارات أدناه)
  • تحديث التخزين المؤقت للتطبيق بواسطة البرنامج

مثال - ملف Cache Manifest الكامل

CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js
NETWORK:
login.asp
FALLBACK:
/html/ /offline.html

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

ملاحظات حول التخزين المؤقت للتطبيقات

لاحظ محتويات التخزين المؤقت.

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

ملاحظة:قد تكون هناك اختلافات في سعة بيانات التخزين المؤقت بين المتصفحات (مثل قيود بعض المتصفحات التي تكون 5MB لكل موقع).