HTML Local Storage

HTML Local Storage: ບຸງຄຸນກວ່າ cookies.

ຫຍັງຈະເປັນ HTML Local Storage?

ຜ່ານການຄອບຄອບທ້ອງຖິ່ນ (Local Storage), ຄະນະຄວາມພາບສະແດງ web ສາມາດຄອບຄອບຂໍ້ມູນທ້ອງຖິ່ນໃນບຸກຄອນຂອງຜູ້ຄົນ.

ກ່ອນ HTML5, ຂໍ້ມູນຂອງຄະນະຄວາມພາບສະແດງຈະສາມາດຄອບຄອບໃນ cookie ເພື່ອການຮຽກຮ້ອງຂອງທະນາຄານ. ການຄອບຄອບທ້ອງຖິ່ນມີຄວາມປອດໄພຫຼາຍກວ່າ, ແລະສາມາດຄອບຄອບຂໍ້ມູນຫຼາຍຫຼາຍທີ່ບໍ່ມີຜົນກະທົບຕໍ່ຄວາມສະແດງຂອງເວັບໄຊ.

ບໍ່ແມ່ນ cookie, ການຄອບຄອບມີຂໍ້ຈຳກັດຫຼາຍຫຼາຍ (ຢ່າງໜ້ອຍ 5MB), ແລະຂໍ້ມູນຈະບໍ່ຖືກສົ່ງໄປຫາທະນາຄານ.

ການຄອບຄອບທ້ອງຖິ່ນຜ່ານພາກວັດທະນະທຳ (origin) (ຜູ້ບໍລິຫານແລະຂັ້ນຕອນ). ທຸກໆໜ້າ, ຈາກພາກວັດທະນະທຳ, ສາມາດຄອບຄອບແລະເຂົ້າເຖິງຂໍ້ມູນດຽວກັນ.

ການສະໜັບສະໜູນບູບປະຊາຊົນອາກາດ

ຄູ່ມືໃນຕາມການສະໜັບສະໜູນ Local Storage ຂອງບູບປະຊາຊົນອາກາດທີ່ໄດ້ຮັບການສະໜັບສະໜູນໄດ້ທັງໝົດ.

API
Web Storage 4.0 8.0 3.5 4.0 11.5

ບັນດາບັນດາບັນດາອົງກອນ HTML Local Storage

HTML Local Storage ສະໜັບສະໜູນບັນດາບັນດາບັນດາອົງກອນທີ່ບັນທຶກຂໍ້ມູນໃນບູບປະຊາຊົນອາກາດ:

  • 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. ຖ້າຜູ້ນຳໃຊ້ປິດໜ້າເວັບໄຊບັນຊີບາດ, ຂໍ້ມູນຈະຖືກລຶບອອກ.

ຄັ້ງທີ່ລາວທີ່ຂ້ອຍຈະທຳຂອງຄົນໃນ session ນີ້ ທີ່ຫລັງການຊັກບັນພຽງຄັ້ງ:

ຄວາມຈຳນວນ

if (sessionStorage.clickcount) {
    sessionStorage.clickcount = Number(sessionStorage.clickcount) + 1;
} else {
    sessionStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "ໃນ session ນີ້,ທ່ານໄດ້ຫລັງການຊັກບັນພຽງຄັ້ງ " +
sessionStorage.clickcount + " ຄັ້ງ.";

ທຳການທີ່ຂ້ອຍຈະທຳ