HTML5 Offline

ဒီနေ့ ကိုသီ (Myanmar Tutorial) က ipad မှာ HTML website offline ရအောင် ဘယ်လိုလုပ်ရမလဲဆိုပြီး facebook မှာ မေးထားတာ တွေ့လိုက်တယ်။ ဒါနဲ့ အရင်ကတည်းက ကြားဖူးတဲ့ HTML5 offline လေးကို စမ်းကြည့်ဖြစ်တယ်။ တစ်ခါမှတော့ ipad မှာ မစမ်းဖူးဘူး။

HTML 5 မှာ Cache Manifest ပါလာပါတယ်။ Google Chrome , Safari , firefox , opera စတာတွေမှာ support လုပ်ပါတယ်။

HTML5 cache ကို support လုပ်ဖို့ .htaccess မှာ

[code lang=”text”]AddType text/cache-manifest .manifest[/code]
ဆိုပြီး ထည့်ပေးရပါတယ်။

နောက်ပြီးတော့ cache.manifest ဆိုပြီး root folder မှာ ဖန်တီးပေးဖို့လိုပါတယ်။ cache.mainfest ဆိုတာ မပေးပဲ mycache.mainfest ဆိုပြီး ပေးလည်း ရပေမယ့် cache.mainfest ဆိုမှသာ iOS device တွေမှာ ကောင်းကောင်း အလုပ်လုပ်နိုင်မှာပါ။ အခြား နာမည်တွေက iOS 4.2 မှာ ပြဿနာတက်တယ်ဆိုပြီး ဖတ်ဖူးပါတယ်။ mainefest မှာ ဘယ်လို ရေးရမလဲဆိုရင်တော့

[code lang=”text”]CACHE MANIFEST
#comment
CACHE:
images/touch-icon-iphone.png
images/touch-icon-ipad.png
images/touch-icon-iphone4.png
images/t_hero.png
images/icon.png
bootstrap.css
about.html[/code]

CACHE MANIFEST ဆိုပြီး ထိပ်မှာ ကြေငြာလိုက်ပါတယ်။ ပြီးတော့ Cache လုပ်မယ့် file တွေကို CACHE: အောက်မှာ ရေးချထားပါတယ်။ mainfest အကြောင်း အသေးစိတ်ကိုတော့ ဒီမှာ ဖတ်နိုင်ပါတယ်။

html file မှာတော့

[code lang=”xml”]<! DOCTYPE html>[/code]

ဆိုပြီး ထိပ်မှာ html5 ဖြစ်ကြောင်း ရေးထားခဲ့ပြီးတော့ cache file ကိုတော့

[code lang=”xml”]<html manifest="cache.manifest">[/code]

ဆိုပြီး cache file name ကို ရေးထားလိုက်ပါတယ်။

ipad မှာ စမ်းကြည့်ချင်တဲ့ သူတွေကတော့ http://comquas.com/html5/cache/ မှာ သွားစမ်းသပ်နိုင်ပါတယ်။ အဲဒီ file ကိုတော့ ဒီမှာ ရယူနိုင်ပါတယ်။

html5 cache
html5 cache with steve job

Home Screen မှာ တင်ထားပြီးတော့ ကျွန်တော့် ဘာသာ testing လုပ်ထားတဲ့ Steve Jobs website ကို offline လွယ်လွယ်ကူကူ ကြည့်နိုင်ပါတယ်။

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.