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

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

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

คุกกี้ถูกสร้างขึ้นมาเพื่อแก้ปัญหานี้

คุกกี้ช่วยให้เว็บไซต์จดจำข้อมูลได้

เมื่อคุณเข้าชมหน้าเว็บในเว็บไซต์ เว็บเบราว์เซอร์จะส่งคำขอไปยังเซิร์ฟเวอร์ของเว็บไซต์เพื่อขอทรัพยากรที่รวมอยู่ในหน้าเว็บ เช่น HTML, CSS, JavaScript หรือรูปภาพ

เว็บเบราว์เซอร์และเว็บไซต์โต้ตอบกันโดยใช้โปรโตคอล HTTP ซึ่งเป็นชุดกฎมาตรฐาน สำหรับการสื่อสาร

ในการตอบสนองต่อคำขอ HTTP สำหรับทรัพยากร เซิร์ฟเวอร์ของเว็บไซต์สามารถรวมข้อมูลเพิ่มเติมที่เรียกว่าส่วนหัวพร้อมกับทรัพยากรนั้นๆ ได้ ส่วนหัว Set-Cookie ที่รวมอยู่ในการตอบกลับ HTTP จะบอกให้เบราว์เซอร์จัดเก็บข้อความบางอย่าง ได้แก่ ชื่อและค่า ซึ่งเรียกว่าคุกกี้ ตัวอย่างเช่น ส่วนหัวการตอบกลับ Set-Cookie: cat=tabby จะบอกเบราว์เซอร์ ให้จัดเก็บคุกกี้ที่มีชื่อ "cat" และค่า "tabby"

เมื่อตั้งค่าคุกกี้นั้นแล้ว คำขอต่อๆ ไปจากเบราว์เซอร์ไปยังเว็บไซต์จะมีส่วนหัว Cookie: cat=tabby เซิร์ฟเวอร์ของเว็บไซต์สามารถเข้าถึงคุกกี้จากส่วนหัวของคำขอ และใช้ค่าได้

วิธีการทำงานของคุกกี้: ทีละขั้นตอน

สมมติว่าคุณเข้าชมเว็บไซต์ cats.example เว็บไซต์ต้องการแสดงรูปภาพแมวแบบสุ่มให้คุณดู และบันทึกว่าแมวตัวใดแสดงต่อคุณ

ขั้นตอนต่อไปนี้จะอธิบายวิธีดำเนินการดังกล่าวด้วยคุกกี้

1. เบราว์เซอร์ขอไฟล์

คุณเข้าชมหน้าแรกของเว็บไซต์ cats.example

เมื่อเบราว์เซอร์ประมวลผล HTML ของหน้าแรกแล้ว เบราว์เซอร์จะขอไฟล์ในหน้า รวมถึง cat.jpg จาก cats.example

คำขอ HTTP ไปยัง https://cats.example/cat.jpg

2. เซิร์ฟเวอร์ของเว็บไซต์ตอบกลับ

เซิร์ฟเวอร์ที่ cats.example ตอบกลับด้วยไฟล์รูปภาพ cat.jpg

ในการตอบกลับ เซิร์ฟเวอร์จะใส่ส่วนหัว Set-Cookie: cat=tabby

การตอบสนอง HTTP จาก https://cats.example/cat.jpg ที่มีส่วนหัว Set-Cookie: cat=tabby

3. เบราว์เซอร์ได้รับการตอบกลับ

เบราว์เซอร์จะได้รับไฟล์รูปภาพและประมวลผลส่วนหัว Set-Cookie: cat=tabby ที่รวมอยู่

ระบบจะจัดเก็บคุกกี้: ชื่อ cat, ค่า tabby

คุกกี้ cat=tabby ในเว็บเบราว์เซอร์บนแล็ปท็อป

4. เบราว์เซอร์ส่งคำขอเพิ่มเติม

นับจากนี้ไป เบราว์เซอร์จะรวมส่วนหัว Cookie: cat=tabby ไว้ในคำขอที่ส่งไปยัง cats.example

คำขอ HTTP ไปยัง https://cats.example/cat.jpg โดยมีส่วนหัว Cookie: cat=tabby

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

กระบวนการทั้งหมดเกี่ยวกับคุกกี้มีดังนี้

  1. เบราว์เซอร์ของคุณขอไฟล์จากเซิร์ฟเวอร์ของเว็บไซต์
  2. เซิร์ฟเวอร์สามารถใส่ส่วนหัว เช่น Set-Cookie: cat=tabby พร้อมกับไฟล์ที่ส่งเพื่อตอบสนองต่อคำขอได้
  3. เมื่อเบราว์เซอร์ได้รับการตอบกลับ ระบบจะจัดเก็บคุกกี้
  4. เมื่อส่งคำขอครั้งต่อๆ ไป เบราว์เซอร์จะส่งคุกกี้ไปยังเซิร์ฟเวอร์ในส่วนหัว Cookie: cat=tabby


แผนภาพลำดับที่แสดงคำขอและการตอบกลับระหว่างเว็บเบราว์เซอร์ cats.example และ cats.example ซึ่งแสดงวิธีตั้งค่าและ ส่งคุกกี้

เข้าถึงคุกกี้ด้วย JavaScript

ตัวอย่างก่อนหน้านี้ใช้ส่วนหัวการตอบกลับ Set-Cookie เพื่อตั้งค่าคุกกี้

นอกจากนี้ยังสร้างคุกกี้ด้วย JavaScript โดยใช้วิธี document.cookie ได้ด้วย

ลองใช้เดโมได้ที่ javascript-cookie.glitch.me

ดูข้อมูลเพิ่มเติม: เอกสาร: พร็อพเพอร์ตี้คุกกี้

เหตุใดเราจึงต้องใช้คุกกี้

ในปี 1994 วิศวกร Lou Montulli ทำงานที่บริษัทซอฟต์แวร์ Netscape ซึ่งต่อมาได้สร้างเว็บเบราว์เซอร์ที่ได้รับความนิยมมากที่สุดในช่วงกลางทศวรรษ 1990 ในขณะเดียวกัน บริษัทโทรคมนาคม MCI ก็พยายามสร้างรถเข็นช็อปปิ้ง สำหรับร้านค้าออนไลน์แห่งแรกๆ ของโลก MCI ได้ติดต่อ Montulli เพื่ออธิบายปัญหาของตน Montulli ตอบกลับด้วยการเพิ่มฟีเจอร์ลงใน HTTP ซึ่งช่วยให้เว็บไซต์จัดเก็บข้อความจำนวนเล็กน้อยในเว็บเบราว์เซอร์ของผู้ใช้ได้ โดยมีชื่อและค่า เช่น cart-id=123 เขาเรียกสิ่งนี้ว่า "คุกกี้" เนื่องจากในสมัยนั้นโปรแกรมเมอร์ใช้คำว่า "คุกกี้วิเศษ" สำหรับข้อมูลเพิ่มเติมเล็กๆ ที่รวมอยู่ในการสื่อสารข้อมูล

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

การใช้คุกกี้

คุกกี้ช่วยให้เบราว์เซอร์จัดเก็บข้อมูลจำนวนเล็กน้อยเกี่ยวกับ ผู้ใช้ เพื่อ "จดจำ" บางสิ่งในคำขอหลายรายการ คุกกี้มีประโยชน์หลายอย่าง ดังนี้

  • การจัดการเซสชัน
    อนุญาตให้เว็บไซต์จดจำผู้ใช้ได้ เช่น เพื่อรักษาสถานะที่เข้าสู่ระบบแล้วในหน้าต่างๆ
  • การปรับเปลี่ยนในแบบของคุณ
    จัดเก็บค่ากำหนดของผู้ใช้ เช่น ภาษา ธีม หรือสินค้าที่ดูล่าสุด เพื่อปรับแต่งประสบการณ์การใช้งานเว็บไซต์
  • การติดตาม
    ในอดีตมีการใช้คุกกี้เพื่อติดตามพฤติกรรมของผู้ใช้ในเว็บไซต์ต่างๆ สำหรับการโฆษณาที่กำหนดเป้าหมายและกรณีการใช้งานอื่นๆ

ส่วนใหญ่จะใช้คุกกี้สำหรับตัวระบุแทนที่จะจัดเก็บข้อมูลโดยตรง

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

คำขอไปยังเซิร์ฟเวอร์ของร้านขายสัตว์เลี้ยงอาจมีส่วนหัวของคุกกี้ดังนี้

Cookie: _cart=CART1.2.34567890.123456789

จากนั้นเซิร์ฟเวอร์จะค้นหาบัญชี _cart ในที่เก็บข้อมูลของตน และรวม ข้อมูลอื่นๆ เกี่ยวกับคำขอ

ดูข้อมูลเพิ่มเติม