HTML 本地存储
- ပြီးဆုံး စာကြိုးစား HTML5 အသုံးပြု
- နောက်လိုက် စာကြိုးစား HTML5 အစားအရေးပါ အသုံးပြုခြင်း
HTML 本地存储：优于 cookies。
什么是 HTML 本地存储？
通过本地存储（Local Storage），web 应用程序能够在用户浏览器中对数据进行本地的存储。
在 HTML5 之前，应用程序数据只能存储在 cookie 中，包括每个服务器请求。本地存储则更安全，并且可在不影响网站性能的前提下将大量数据存储于本地。
ကင်းဆိုင် သုံးစွဲ မဟုတ် သော်လည်း သတင်း များ ကို အမှတ် များ ကို သတ်မှတ် ပြီး အားလုံး အား သတ်မှတ် ပြီး အခြား လုပ်ငန်း များ သို့ အသွား မပေါ်ပေါ် သည်။
နောက်ခံ တွင် စနစ် မှ သတင်း များ ကို သတ်မှတ် ပြီး အခြား နိုင်ငံ နှင့် ကိုယ်စားပြု တိုက်သွားခြင်း ကို ပေါ်လစ် (origin) (အာရီကီ နှင့် ပေါင်းစပ်) ဖြင့် လုပ်ဆောင်သည်။ အားလုံး စာမျက်နှာများ မှ အစိုးရ တွင် အတိုင်းအတာ အတိုင်း သတင်း များ ကို သတ်မှတ် နှင့် ခေါ်ထား နိုင်ပါသည်。
浏览器支持
表格中的数组指示了完全支持本地存储的首个浏览器版本。
| API | |||||
| Web Storage | 4.0 | 8.0 | 3.5 | 4.0 | 11.5 |
HTML 本地存储对象
HTML 本地存储提供了两个在客户端存储数据的对象：
- window.localStorage - 存储没有截止日期的数据
- window.sessionStorage - 针对一个 session 来存储数据（当关闭浏览器标签页时数据会丢失）
ဘားဖြစ်မှာ ဘားမှ ဘားသို့ သုံးစွဲခြင်း၏ ဘားဖြစ်မှာ ဘားမှ ဘားသို့ ကျန်ရှိသည်။ localStorage နှင့် sessionStorage ကို ဘားဖြစ်မှာ ဘားမှ ဘားသို့ စစ်ဆေးပါနှင့်:
if (typeof(Storage) !== "undefined") {
// localStorage/sessionStorage အတွက် အပိုင်းအခြာ
} else {
// ပြောပါ မည်မဟုတ်! Web Storage ကို ထောက်ပံ့ခြင်း မရှိပါဘူး ..
}
localStorage အရာများ
localStorage အရာများ သည် အစားအပြု အချိန်ကြား သုံးစွဲကြောင်း ဖြစ်သည်။ ဘားဖြစ်မှာ ဘားမှ ဘားသို့ အချိန် လွဲလျား အား အသုံးပြုကြောင်း။
အကျိုးသတ္တု
// သို့မဟုတ် သို့
localStorage.setItem("lastname", "Gates");
// ပြန်ဆင်ခြင်း
document.getElementById("result").innerHTML = localStorage.getItem("lastname");
အကျိုးသက်ရောက်မှုချက်များ
- localStorage အမည်/အမှတ် ပေါင်းစုံ ကို ဖွဲ့စည်းပြီး ဖြစ်သည်: name="lastname" လို့ ဖြစ်သည်။ value="Gates"
- "lastname" အမှတ် ပြန်ဆင်၍ အခြား id="result" အရာ သို့ ထိန်းချိုးခြင်း
အထင်ကို လည်း အသုံးပြုနိုင်သည်:
// သို့မဟုတ် သို့
localStorage.lastname = "Gates";
// ပြန်ဆင်ခြင်း
document.getElementById("result").innerHTML = localStorage.lastname;
"lastname" localStorage ပုဂ္ဂိုလ်ကို ဖျက်သိမ်းခြင်း၏ ပုံစံမှာ အော်ဆိုးနေဆဲဖြစ်သည်:
localStorage.removeItem("lastname");
ဖော်ပြချက်: အမည်/အမှတ် ပေါင်းစုံသည် အစားအပြုအား ဖြည့်စွက်၍ ကျန်ရှိသည်။ အခြားပုံစံသို့ ပြောင်းလဲသင့်ကြောင်း သတိပြုပါနှင့်!
အမှတ်ပေးခြင်းများအား အသုံးပြု၍ အသုံးပြုသူမှာ ဘေ့တာအား စာချုပ်တစ်ခုချင်းစီ သုံးစွဲခြင်း၏ စာရင်းချုပ်ကို စစ်ဆေးကြောင်း။ ကနေ့အချင်းအား ကြိမ်တမ်းအား အခွန်တန်းအား သို့ သုံးစွဲ၍ အသုံးပြုကြောင်း။
အကျိုးသတ္တု
if (localStorage.clickcount) {
localStorage.clickcount = Number(localStorage.clickcount) + 1;
} else {
localStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "သင် ဒီ နှုတ်ခုံ ကို " +
localStorage.clickcount + " ကြိုးစားခြင်း " +
sessionStorage အဖွဲ့အစည်း
sessionStorage အဖွဲ့အစည်း သည် localStorage အဖွဲ့အစည်း နှင့် အတူတူပဲ ဖြစ်သည်။ အခြားနေရာမှ ကျယ်ပြန်သော အခွင့်အရေး ကို သတိပြုပါ။ အသုံးပြုသူ က ဘရောက်ဆာကုသမာ ချပ်ကို ပိတ်သွားလျှင် အခွင့်အရေး အား ဖျက်သိမ်းလိုက်သည်။
အောက်ပါ အကျိုးသတ္တု တွင် ဒီ session တွင် အသုံးပြုသူ က နှုတ်ခုံ ကို ကြိုးစားခြင်း ကို အတိုင်းအတာပြုထားပါသည်：
အကျိုးသတ္တု
if (sessionStorage.clickcount) {
sessionStorage.clickcount = Number(sessionStorage.clickcount) + 1;
} else {
sessionStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "ဒီ session တွင်，သင် ဒီ နှုတ်ခုံ ကို " +
sessionStorage.clickcount + " ကြိုးစားခြင်း " +
- ပြီးဆုံး စာကြိုးစား HTML5 အသုံးပြု
- နောက်လိုက် စာကြိုးစား HTML5 အစားအရေးပါ အသုံးပြုခြင်း
