คำขอและการตอบกลับ HTTP

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

  • เมื่อคุณเข้าชมหน้าเว็บ เบราว์เซอร์จะส่งคําขอ HTTP ไปยังทรัพยากรในหน้า เช่น HTML, CSS, JavaScript และรูปภาพ
  • เมื่อเซิร์ฟเวอร์ HTTP (เว็บเซิร์ฟเวอร์ที่โฮสต์เว็บไซต์) ได้รับคําขอ HTTP ที่ถูกต้องจากเบราว์เซอร์ เซิร์ฟเวอร์จะตอบสนองต่อเบราว์เซอร์ด้วยการตอบกลับ HTTP
  • คำขอและการตอบกลับอาจมีข้อมูลเพิ่มเติมที่เรียกว่าส่วนหัว HTTP

ตัวอย่างเช่น ลองพิจารณาเว็บไซต์ cats.example.

เว็บไซต์ mythical cats.example

ส่งคำขอ

การเข้าถึงหน้า cats.example จะเริ่มต้นชุดคําขอไปยังโดเมนต่างๆ ซึ่งรวมถึงคำขอรูปภาพที่โฮสต์ใน cats.example เอง คำขอสคริปต์การวิเคราะห์จาก analytics.example และคำขออื่นๆ สำหรับทรัพยากรเพิ่มเติมจากโดเมนอื่นๆ

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

  • Accept-Language: en-US
    ส่วนหัวนี้ระบุภาษาที่ผู้ใช้ต้องการ ซึ่งในกรณีนี้คือภาษาอังกฤษ (สหรัฐอเมริกา)
  • User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/127.0.0.0 Safari/537.36
    ส่วนหัวนี้ให้รายละเอียดเกี่ยวกับเบราว์เซอร์และระบบปฏิบัติการของผู้ใช้ ซึ่งในกรณีนี้คือ "Mozilla/5.0" (ตระกูลเบราว์เซอร์), "Macintosh" (ระบบปฏิบัติการ) และ "Chrome/127.0.0.0" (เวอร์ชันเบราว์เซอร์)

คำตอบ

เมื่อเว็บเซิร์ฟเวอร์ได้รับคําขอที่ถูกต้องจากเบราว์เซอร์ เซิร์ฟเวอร์จะส่งการตอบกลับไปยังเบราว์เซอร์พร้อมทรัพยากรที่ขอ ("เพย์โหลด") ซึ่งได้แก่ HTML, CSS, JavaScript, ไฟล์รูปภาพ, วิดีโอ หรือข้อมูลอื่นๆ เช่นเดียวกับที่คำขอแต่ละรายการจากเบราว์เซอร์อาจมีส่วนหัวคำขอ การตอบกลับแต่ละรายการจากเซิร์ฟเวอร์ก็อาจมีส่วนหัวการตอบกลับได้ ระบบจะส่งส่วนหัวการตอบกลับเหล่านี้ไปพร้อมกับเพย์โหลด

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

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


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

เดโม

  • 1pc.glitch.me: การสาธิตคุกกี้ของบุคคลที่หนึ่ง
  • 3pc.glitch.me: การสาธิตคุกกี้ของบุคคลที่สาม

เครื่องมือ

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