ذخیره صفحات بر روی کامپیوتر کاربر

چاپ

در HTML5 به سادگی می توان یک نسخه offline از برنامه وب را با ایجاد یک فایل Manifest ساخت.


Application Cache چیست؟

Html5 قابلیت جدیدی را با نام Application Cache به کاربران وب ارائه داده است و امکان ذخیره شدن صفحات مرور شده بر روی کامپیوتر کاربر و مشاهده آنها را در زمان قطع ارتباط با اینترنت (offline) را فراهم می کند.

Application Cache سه مزیت را در اختیار کاربران قرار می دهد:


پشتیبانی مرورگرها

Internet Explorer Firefox Opera Google Chrome Safari

مرورگرهای Internet Explorer 10+, Firefox, Opera, Chrome, Safari متد Application Cache را پشتیبانی می کنند.


مثالی از یک صفحه HTML با قابلیت Application Cashe

مثال زیر، یک صفحه وب با قابلیت مرور offline صفحات در کامپیوتر کاربر را نشان می دهد. در این صفحه قابلیت Application Cache فعال است. توجه نمایید که این خاصیت در حالت عادی، فعال نیست.

مثال (ذخیره صفحات بر روی کامپیوتر کاربر)

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

<body>
The content of the document......
</body>

</html>
خودتان امتحان کنید »

فعال نمودن قابلیت Application Cache

برای فعال کردن این قابلیت، در تگ <html>، خاصیت manifest را با نام فایل manifest تنظیم نمایید:

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

هر صفحه ای که خاصیت manifest برای آن تنظیم شده باشد، با هر بار مشاهده کاربر در حافظه ذخیره می شود (Cached). اگر خاصیت manifest مشخص نشده باشد، صفحه مورد نظر در حافظه ذخیره نمی شود (مگر اینکه بطور مستقیم صفحه مورد نظر را در فایل manifest مشخص نمایید.)

فرمت رایج برای ذخیره فایل های manifest، فرمت "appcache." است.


فایل Manifest

فایل Manifest یک فایل متنی ساده است و به مرورگر می گوید که چه چیزهایی را باید و نباید Cache نماید.

این فایل شامل 3 قسمت اصلی است:

در این قسمت به تشریح خط به خط فایل Manifest می پردازیم:

CACHE MANIFEST

در خط اول، ذکر عبارت CACHE MANIFEST الزامی است:

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

در فایل Manifest بالا، لیست فایل هایی که باید Cache شوند آورده شده است، یک فایل CSS، یک عکس با فرمت gif. و یک فایل JavaScript

زمانی که فایل Manifest اجرا می شود مرورگر 3 فایل تعیین شده را از سرور سایت، دانلود و ذخیره می کند. بنابراین هر زمان که کاربر به اینترنت متصل نباشد، سایر فایل های جانبی صفحه (مثل تم یا اسکریپت ها) نیز قابل دسترس خواهند بود.

NETWORK

در قسمت بعدی، عبارت Network قرار داده می شود. فایل هایی که در زیر عبارت Network تعیین شوند هیچگاه توسط مرورگر Cache نخواهند شد:

NETWORK:
login.asp

از علامت ستاره (*) می توانید برای نشان دادن اینکه تمام فایل ها، نیاز به ارتباط اینترنتی دارند استفاده نمایید:

NETWORK:
*

FALLBACK

در قسمت آخر نیز، عبارت FALLBACK قرار داده می شود. در صورتی که صفحه به هر دلیلی قابل دسترسی و مشاهده نباشد، فایلی که در زیر این عبارت تعیین شود، نشان داده خواهد شد.

در مثال زیر، فایل "offline.html" در صورتی که ارتباط با اینترنت میسر نباشد، بجای تمام فایل هایی که در پوشه /html/ قرار دارند، بکار خواهد رفت:

FALLBACK:
/html/ /offline.html

Update و به روز رسانی فایل های Cache شده

فایلی که بر روی کامپیوتر کاربر ذخیره می شود بدون تغییر باقی می ماند. مگر اینکه یکی از حالات زیر اتفاق بیافتد:

مثال - فرم نهایی فایل MANIFEST

CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js

NETWORK:
login.asp

FALLBACK:
/html/ /offline.html

توجه: خطوطی که با کاراکتر "#" شروع می شوند، توضیحات اند (comments)، اما علاوه بر این، می توان از آن برای اهداف دیگری نیز استفاده نمود. مرورگر پس از ذخیره صفحه بر روی کامپیوتر کاربر، همواره صفحه ذخیره شده را نمایش داده و اگر فایل اصلی تغییر کند به کاربر اطلاع نمی دهد، مگر اینکه فایل Manifest آنرا Update کنید. یکی از راه های دوباره Cache کردن فایل ها توسط مرورگر، این است که تاریخ و نسخه مشخص شده در خط Comment را تغییر دهید.


نکاتی درباره Application Cache

در استفاده از این قابلیت و اینکه چه فایل هایی را بر روی کامپیوتر کاربران Cache می کنید، دقت نمایید.

مرورگر پس از ذخیره صفحه برروی کامپیوتر کاربر، همواره صفحه ذخیره شده را نمایش داده و اگر فایل اصلی تغییر کند به کاربر اطلاع نمی دهد. مگر اینکه فایل Manifest آنرا Update کنید.

همچنین مرورگرهای مختلف محدودیت مشخصی در حجم فایل های ذخیره شده لحاظ می کنند (معمولا مرورگرها، حداکثر 5 مگابایت برای ذخیره فایل های هر سایت اختصاص می دهند)