การทำความเข้าใจเกี่ยวกับคุกกี้

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

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

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

คุกกี้เป็นหนึ่งในวิธีการเพิ่มสถานะที่เก็บถาวรลงในเว็บไซต์ ตลอดหลายปีที่ผ่านมา บริษัทได้พัฒนาและพัฒนาความสามารถ แต่ก็ได้ออกจากแพลตฟอร์มไปพร้อมกับปัญหาเดิมที่เป็นปัญหา เบราว์เซอร์ (รวมถึง Chrome, Firefox และ Edge) จึงเปลี่ยนแปลงลักษณะการทํางานเพื่อบังคับใช้ค่าเริ่มต้นที่รักษาความเป็นส่วนตัวมากขึ้นเพื่อแก้ไขปัญหานี้

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

สมมติว่าคุณมีบล็อกที่ต้องการแสดงโปรโมชัน "มีอะไรใหม่" ต่อผู้ใช้ ผู้ใช้ปิดโปรโมชันได้และจะไม่เห็นโปรโมชันนั้นอีกระยะหนึ่ง คุณสามารถจัดเก็บค่ากําหนดนั้นไว้ในคุกกี้ ตั้งค่าให้หมดอายุใน 1 เดือน (2,600,000 วินาที) และส่งผ่าน HTTPS เท่านั้น ส่วนหัวดังกล่าวจะมีลักษณะดังนี้

Set-Cookie: promo_shown=1; Max-Age=2600000; Secure
คุกกี้ 3 รายการกำลังส่งจากเซิร์ฟเวอร์ไปยังเบราว์เซอร์ในการตอบกลับ
เซิร์ฟเวอร์จะตั้งค่าคุกกี้โดยใช้ส่วนหัว Set-Cookie

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

Cookie: promo_shown=1
กำลังส่งคุกกี้ 3 รายการจากเบราว์เซอร์ไปยังเซิร์ฟเวอร์ในคำขอ
เบราว์เซอร์จะส่งคุกกี้กลับในส่วนหัว Cookie

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

→ document.cookie = "promo_shown=1; Max-Age=2600000; Secure"
← "promo_shown=1; Max-Age=2600000; Secure"

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

→ document.cookie;
← "promo_shown=1; color_theme=peachpuff; sidebar_loc=left"
JavaScript ที่เข้าถึงคุกกี้ภายในเบราว์เซอร์
JavaScript สามารถเข้าถึงคุกกี้ได้โดยใช้ document.cookie

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

คุกกี้ของบุคคลที่หนึ่งและบุคคลที่สามคืออะไร

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

คุกกี้ 3 รายการที่ส่งไปยังเบราว์เซอร์จากคำขอที่แตกต่างกันในหน้าเดียวกัน
คุกกี้อาจมาจากโดเมนต่างๆ ที่หลากหลายในหน้าเดียว

จากตัวอย่างด้านบน สมมติว่าโพสต์บล็อกของคุณมีรูปภาพแมวที่น่ารักมากอยู่และโฮสต์อยู่ที่ /blog/img/amazing-cat.png เนื่องจากรูปภาพนี้ยอดเยี่ยมมาก บุคคลอื่นจึงนำไปใช้ในเว็บไซต์ของตนโดยตรง หากผู้เข้าชมเคยไปที่บล็อกของคุณและมีคุกกี้ promo_shown เมื่อผู้เข้าชมดู amazing-cat.png ในเว็บไซต์ของบุคคลอื่น ระบบจะส่งคุกกี้นั้นในคำขอรูปภาพ ไม่มีประโยชน์สำหรับใครเลย เนื่องจาก promo_shown ไม่ได้มีการใช้ทำอะไรในเว็บไซต์ของบุคคลดังกล่าว เพียงแต่เป็นการเพิ่มโอเวอร์เฮดให้กับคำขอ

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

คุกกี้เดียวกันที่ส่งในบริบทที่แตกต่างกัน 3 บริบท
ระบบจะส่งคุกกี้ในบริบทของบุคคลที่สามเมื่อเข้าชมหน้าเว็บต่างๆ

ลักษณะทางวัฒนธรรมอย่างหนึ่งของเว็บคือมีแนวโน้มที่จะเปิดอยู่โดยค่าเริ่มต้น สิ่งนี้ช่วยให้ผู้คนจำนวนมากสร้างเนื้อหาและแอปของตนเองบนแพลตฟอร์มของเราได้ อย่างไรก็ตาม การดำเนินการนี้ยังทำให้เกิดข้อกังวลด้านความปลอดภัยและความเป็นส่วนตัวเป็นจำนวนมากด้วย การโจมตีการปลอมแปลงคำขอแบบข้ามเว็บไซต์ (CSRF) ขึ้นอยู่กับข้อเท็จจริงที่ว่าคุกกี้มีการแนบมากับคำขอใดๆ ก็ตามที่ส่งถึงต้นทาง ไม่ว่าใครจะเป็นผู้ส่งคำขอก็ตาม ตัวอย่างเช่น หากคุณเข้าชม evil.example เว็บไซต์ดังกล่าวจะทริกเกอร์คำขอไปยัง your-blog.example และเบราว์เซอร์จะแนบคุกกี้ที่เกี่ยวข้อง ถ้าบล็อกของคุณไม่ระมัดระวังวิธีตรวจสอบคำขอเหล่านั้น evil.example อาจเรียกใช้การดำเนินการต่างๆ เช่น การลบโพสต์หรือเพิ่มเนื้อหาของตนเอง

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

คุณระบุ Intent ของคุณเองด้วยคุกกี้ได้โดยการตั้งค่าแอตทริบิวต์ SameSite ที่เหมาะสม

ดูสูตรคุกกี้ของบุคคลที่หนึ่งเพื่อระบุคุกกี้ของบุคคลที่หนึ่งและตั้งค่าแอตทริบิวต์ที่เหมาะสม