คำอธิบายเกี่ยวกับคุกกี้ SameSite

การรองรับเบราว์เซอร์

  • Chrome: 51
  • Edge: 16.
  • Firefox: 60
  • Safari: 13.

แหล่งที่มา

คุกกี้ทุกรายการมีคู่คีย์-ค่าพร้อมกับแอตทริบิวต์จํานวนหนึ่งที่ควบคุมเวลาและตําแหน่งที่จะใช้คุกกี้นั้น

การใช้แอตทริบิวต์ SameSite (ที่ระบุไว้ใน RFC6265bis) ช่วยให้คุณประกาศได้ว่าคุกกี้ของคุณจํากัดอยู่ในบริบทของบุคคลที่หนึ่งหรือบริบทของเว็บไซต์เดียวกัน คุณควรทำความเข้าใจความหมายของ "เว็บไซต์" ที่นี่ เว็บไซต์คือชุดค่าผสมของส่วนต่อท้ายโดเมนและส่วนของโดเมนก่อนหน้า เช่น โดเมน www.web.dev เป็นส่วนหนึ่งของเว็บไซต์ web.dev

คําสําคัญ: หากผู้ใช้อยู่ใน www.web.dev และขอรูปภาพจาก static.web.dev แสดงว่าเป็นคําขอในเว็บไซต์เดียวกัน

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

คําสําคัญ: หากผู้ใช้อยู่ใน your-project.github.io และขอรูปภาพจาก my-project.github.io นั่นคือคําขอข้ามเว็บไซต์

ใช้แอตทริบิวต์ SameSite เพื่อประกาศการใช้คุกกี้

แอตทริบิวต์ SameSite ในคุกกี้มี 3 วิธีในการควบคุมลักษณะการทํางานนี้ คุณเลือกที่จะไม่ระบุแอตทริบิวต์ หรือจะใช้ Strict หรือ Lax เพื่อจํากัดคุกกี้ให้ใช้กับคําขอในเว็บไซต์เดียวกันก็ได้

หากคุณตั้งค่า SameSite เป็น Strict ระบบจะส่งคุกกี้ได้เฉพาะในบริบทของบุคคลที่หนึ่งเท่านั้น กล่าวคือ ในกรณีที่เว็บไซต์ของคุกกี้ตรงกับเว็บไซต์ที่แสดงในแถบที่อยู่ของเบราว์เซอร์ ดังนั้น หากตั้งค่าคุกกี้ promo_shown ดังนี้

Set-Cookie: promo_shown=1; SameSite=Strict

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

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

<p>Look at this amazing cat!</p>
<img src="https://blog.example/blog/img/amazing-cat.png" />
<p>Read the <a href="https://blog.example/blog/cat.html">article</a>.</p>

เมื่อตั้งค่าคุกกี้เป็น Lax ดังนี้

Set-Cookie: promo_shown=1; SameSite=Lax

เมื่อเบราว์เซอร์ขอ amazing-cat.png สําหรับบล็อกของบุคคลอื่น เว็บไซต์ของคุณจะไม่ส่งคุกกี้ อย่างไรก็ตาม เมื่อผู้อ่านไปที่ลิงก์ไปยัง cat.html ในเว็บไซต์ของคุณ คําขอดังกล่าวจะมีคุกกี้รวมอยู่ด้วย

เราขอแนะนำให้ใช้ SameSite ในลักษณะนี้ โดยตั้งค่าคุกกี้ที่ส่งผลต่อการแสดงผลเว็บไซต์เป็น Lax และตั้งค่าคุกกี้ที่เกี่ยวข้องกับการดําเนินการของผู้ใช้เป็น Strict

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

คุกกี้ 3 รายการที่ติดป้ายกํากับว่า &quot;ไม่มี&quot; &quot;ไม่เข้มงวด&quot; หรือ &quot;เข้มงวด&quot; โดยขึ้นอยู่กับบริบท
ทําเครื่องหมายบริบทของคุกกี้เป็น None, Lax หรือ Strict อย่างชัดเจน

การเปลี่ยนแปลงลักษณะการทำงานเริ่มต้นโดยไม่มี SameSite

การรองรับเบราว์เซอร์

  • Chrome: 80
  • Edge: 86
  • Firefox: อยู่หลังธง
  • Safari: ไม่รองรับ

แอตทริบิวต์ SameSite ได้รับการรองรับอย่างกว้างขวาง แต่ยังไม่มีการนำไปใช้อย่างแพร่หลาย ก่อนหน้านี้ การตั้งค่าคุกกี้โดยไม่มี SameSite จะส่งคุกกี้ในบริบททั้งหมดโดยค่าเริ่มต้น ซึ่งทำให้ผู้ใช้เสี่ยงที่จะเกิด CSRF และการรั่วไหลของข้อมูลโดยไม่ตั้งใจ เพื่อส่งเสริมให้นักพัฒนาแอประบุความตั้งใจของตนและมอบประสบการณ์การใช้งานที่ปลอดภัยยิ่งขึ้น เอกสารข้อเสนอของ IETF เรื่อง คุกกี้ที่ดีขึ้นเรื่อยๆ ได้ระบุการเปลี่ยนแปลงสำคัญ 2 ประการดังนี้

  • ระบบจะถือว่าคุกกี้ที่ไม่มีแอตทริบิวต์ SameSite เป็น SameSite=Lax
  • คุกกี้ที่มี SameSite=None จะต้องระบุ Secure ด้วย ซึ่งหมายความว่าต้องใช้บริบทที่ปลอดภัย

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

SameSite=Lax โดยค่าเริ่มต้น

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

SameSite=None ต้องปลอดภัย

เมื่อสร้างคุกกี้ข้ามเว็บไซต์โดยใช้ SameSite=None คุณต้องตั้งค่าเป็น Secure ด้วยเพื่อให้เบราว์เซอร์ยอมรับคุกกี้ดังกล่าว

Set-Cookie: widget_session=abc123; SameSite=None; Secure

คุณสามารถทดสอบลักษณะการทํางานนี้ได้ตั้งแต่ Chrome 76 โดยเปิดใช้ about://flags/#cookies-without-same-site-must-be-secure และจาก Firefox 69 โดยตั้งค่า network.cookie.sameSite.noneRequiresSecure ใน about:config

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

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

ขอขอบคุณ Lily Chen, Malte Ubl, Mike West, Rob Dodson, Tom Steiner และ Vivek Sekhar ที่ให้ความร่วมมือและแสดงความคิดเห็น

รูปภาพหลักของคุกกี้โดย Pille-Riin Priske ใน Unsplash