ที่เก็บข้อมูลในเครื่องเทียบกับที่เก็บข้อมูลเซสชันเทียบกับคุกกี้: อะไรคือความแตกต่าง [Partition Magic]

Local Storage และ Session Storage คืออะไร? อะไรคือความแตกต่างระหว่าง ที่เก็บข้อมูลในเครื่องเทียบกับที่เก็บข้อมูลเซสชัน เทียบกับคุกกี้? หากคุณสับสน ไม่ต้องกังวล ในโพสต์นี้ ตัวช่วยสร้างพาร์ติชันไซต์นี้ ให้บทช่วยสอนเกี่ยวกับ localstorage vs sessionstorage vs คุกกี้





ในหน้านี้:

เราสามารถจัดเก็บข้อมูลไว้ในเครื่องบนเบราว์เซอร์ของเราได้หลายวิธี วิธีหนึ่งที่ได้รับความนิยมมากกว่า คุกกี้ . หากต้องการทราบข้อมูลโดยละเอียดเพิ่มเติม โปรดอ่านต่อ

ที่เก็บข้อมูลในเครื่องคืออะไร?

Local Storage เป็นวิธีการจัดเก็บข้อมูลเครือข่ายที่ช่วยให้เราจัดเก็บข้อมูลบนคอมพิวเตอร์ไคลเอ็นต์ในรูปแบบของคู่คีย์/ค่าในเว็บเบราว์เซอร์ ข้อมูลจะถูกเก็บไว้อย่างถาวรใน Local Storage เว้นแต่ผู้ใช้จะลบออกจากเบราว์เซอร์ด้วยตนเอง ไม่หมดอายุแม้ว่าผู้ใช้จะปิดหน้าต่างหรือแท็บก็ตาม

ข้อมูลในเบราว์เซอร์สามารถเข้าถึงได้ผ่าน JavaScript และ HTML5 เท่านั้น อย่างไรก็ตาม ผู้ใช้ยังสามารถ ล้างข้อมูลเบราว์เซอร์ / แคช เพื่อล้างข้อมูล Local Storage ทั้งหมด มีสี่วิธีที่สามารถใช้เพื่อตั้งค่า เรียก ลบ และล้าง:



  • เราสามารถตั้งค่าข้อมูลใน Local Storage โดยใช้วิธี setItem() วิธีการใช้สองพารามิเตอร์ คีย์และค่า ด้วยวิธีนี้ เราสามารถเก็บค่าโดยใช้คีย์: localStorage.setItem(key, value)
  • ในการดึงข้อมูลที่เก็บไว้ในนั้น เราสามารถใช้เมธอด getItem(): localStorage getItem(คีย์)
  • เราสามารถลบข้อมูลด้วยความช่วยเหลือของเมธอด removeItem() ซึ่งเก็บข้อมูลเกี่ยวกับคีย์ในหน่วยความจำ: localStorage ลบรายการ (คีย์)
  • ใช้เมธอด clear() เพื่อล้างข้อมูลทั้งหมดที่เก็บไว้ในนั้น

พื้นที่เก็บข้อมูลเซสชันคืออะไร?

มันคล้ายกับ Local Storage มาก ข้อแตกต่างที่สำคัญคือวงจรการใช้งานที่ยังคงอยู่ในเบราว์เซอร์จนกว่าจะเปิดแท็บปัจจุบัน ข้อมูลใน Session Storage จะหายไปเมื่อคุณปิดแท็บหรือยกเลิก เรายังสามารถตั้งค่าและดึงข้อมูลโดยใช้เมธอด setItem() และ getItem() ตามลำดับ ซึ่งคล้ายกับเมธอด Local Storage ตัวอย่างเช่น: sessionStorage setItem(คีย์, ค่า); เซสชันในที่เก็บข้อมูล getItem(คีย์)

คุกกี้คืออะไร?

ก่อนการเปิดตัว HTML5 ตัวเลือกเดียวที่มีคือคุกกี้ ดังนั้นการจัดเก็บข้อมูลด้วยวิธีดั้งเดิมในการจัดเก็บข้อมูลบนเครื่องไคลเอนต์ ช่วยให้เราจัดเก็บข้อมูลลูกค้าและมอบประสบการณ์ที่เป็นส่วนตัวแก่ผู้ใช้เว็บไซต์ สิ่งเหล่านี้จะถูกส่งไปยังเซิร์ฟเวอร์พร้อมกับคำขอและไปยังไคลเอ็นต์ในการตอบสนอง ดังนั้นจึงมีการแลกเปลี่ยนข้อมูลกับเซิร์ฟเวอร์ในทุกคำขอ เซิร์ฟเวอร์สามารถใช้ข้อมูลคุกกี้เพื่อส่งเนื้อหาส่วนบุคคลไปยังผู้ใช้



ตอนนี้ คุณอาจมีความเข้าใจโดยรวมเกี่ยวกับ Cookie, Local Storage และ Session Storage ส่วนต่อไปนี้จะมุ่งเน้นไปที่ความแตกต่างระหว่างคุกกี้ พื้นที่จัดเก็บในตัวเครื่อง และการจัดเก็บเซสชัน

ในส่วนนี้ เราจะพูดถึง localstorage เทียบกับ sessionstorage เทียบกับ Cookie จากแง่มุมของขีดจำกัดของพื้นที่เก็บข้อมูล การเข้าถึง และการหมดอายุ



ขีดจำกัดการจัดเก็บ

วิธีการจัดเก็บข้อมูลของเบราว์เซอร์แต่ละวิธีมีขนาดข้อมูลสูงสุดเฉพาะ ที่เก็บข้อมูลทั้งสองมีที่เก็บข้อมูลจำนวนมาก โดยเฉพาะอย่างยิ่ง พื้นที่จัดเก็บในเครื่องจัดเก็บได้สูงสุด 10 เมกะไบต์ และที่จัดเก็บเซสชันจัดเก็บได้สูงสุด 5 เมกะไบต์ ในทางกลับกัน คุกกี้มีความจุขนาดเล็กที่จำกัดมากที่ 4 KB ดังนั้นจึงเป็นไปไม่ได้ที่จะเก็บข้อมูลจำนวนมากไว้ในคุกกี้

การเข้าถึง

จากมุมมองของการช่วยสำหรับการเข้าถึง สามารถเข้าถึงได้ในหน้าต่างหรือแท็บใดๆ ที่เปิดบนเว็บเบราว์เซอร์ เนื่องจากที่เก็บข้อมูลเซสชันเชื่อมโยงกับเซสชันเฉพาะและแต่ละแท็บมีเซสชัน ข้อมูลจึงมีเฉพาะในแท็บปัจจุบันที่เราตั้งค่าข้อมูลพื้นที่เก็บข้อมูลเซสชัน ที่เก็บข้อมูลในเครื่องสามารถเข้าถึงได้จากหน้าต่างหรือแท็บใดก็ได้ หรือบนเซิร์ฟเวอร์ คุกกี้ค่อนข้างคล้ายกับ Local Storage

หมดอายุ

ข้อมูลของที่จัดเก็บในเครื่องไม่มีวันหมดอายุจนกว่าคุณจะลบออกด้วยตนเอง เว้นแต่ผู้ใช้จะลบออกจากเบราว์เซอร์ด้วยตนเอง ข้อมูลจะถูกจัดเก็บไว้ในที่จัดเก็บในเครื่องอย่างถาวร ไม่หมดอายุแม้ว่าผู้ใช้จะปิดหน้าต่างหรือแท็บก็ตาม



และเมื่อ Session Storage ปิดแท็บหรือยกเลิก ข้อมูลใน Session Store ก็จะหายไปด้วย

สถานที่จัดเก็บ

พวกเขาถูกเก็บไว้แตกต่างกัน คุกกี้สามารถจัดเก็บในเบราว์เซอร์และเซิร์ฟเวอร์ และ Local Storage และ Session Storage สามารถจัดเก็บไว้ในเบราว์เซอร์เท่านั้น