AJAX - XMLHttpRequest

วัตถุ XMLHttpRequest เป็นคีย์ของ AJAX มีให้บริการนับตั้งแต่ Internet Explorer 5.5 เปิดตัวในเดือนกรกฎาคม 2543 แต่ยังไม่ถูกค้นพบทั้งหมดจนกระทั่ง AJAX และ Web 2.0 ในปี 2548 ได้รับความนิยม

XMLHttpRequest (XHR) คือ API ที่สามารถใช้โดย JavaScript, JScript, VBScript และภาษาสคริปต์ของเว็บเบราว์เซอร์อื่น ๆ เพื่อถ่ายโอนและจัดการข้อมูล XML ไปยังและจากเว็บเซิร์ฟเวอร์โดยใช้ HTTP โดยสร้างช่องทางการเชื่อมต่อที่เป็นอิสระระหว่างฝั่งไคลเอ็นต์ของหน้าเว็บและ ฝั่งเซิร์ฟเวอร์

ข้อมูลที่ส่งคืนจากการเรียก XMLHttpRequest มักจะถูกจัดเตรียมโดยฐานข้อมูลส่วนหลัง นอกจาก XML แล้ว XMLHttpRequest ยังสามารถใช้เพื่อดึงข้อมูลในรูปแบบอื่น ๆ เช่น JSON หรือแม้แต่ข้อความธรรมดา

คุณได้เห็นตัวอย่างสองสามตัวอย่างเกี่ยวกับวิธีการสร้างอ็อบเจ็กต์ XMLHttpRequest

ด้านล่างนี้เป็นวิธีการและคุณสมบัติบางอย่างที่คุณต้องทำความคุ้นเคย

วิธี XMLHttpRequest

• abort()

  ยกเลิกคำขอปัจจุบัน

• getAllResponseHeaders()

  ส่งคืนส่วนหัว HTTP ชุดที่สมบูรณ์เป็นสตริง

• getResponseHeader( headerName )

  ส่งคืนค่าของส่วนหัว HTTP ที่ระบุ

• open( method, URL )

• open( method, URL, async )

• open( method, URL, async, userName )

• open( method, URL, async, userName, password )

  ระบุเมธอด URL และแอ็ตทริบิวต์ทางเลือกอื่น ๆ ของคำร้องขอ

  พารามิเตอร์ method สามารถมีค่าเป็น "GET" "POST" หรือ "HEAD" วิธี HTTP อื่น ๆ เช่น "PUT" และ "DELETE" (ส่วนใหญ่ใช้ในแอปพลิเคชัน REST) ​​อาจเป็นไปได้

  พารามิเตอร์ "async" ระบุว่าควรจัดการคำขอแบบอะซิงโครนัสหรือไม่ "true" หมายความว่าการประมวลผลสคริปต์ดำเนินการหลังจากเมธอด send () โดยไม่ต้องรอการตอบกลับและ "false" หมายความว่าสคริปต์รอการตอบกลับก่อนที่จะดำเนินการกับสคริปต์ต่อไป

• send( content )

  ส่งคำขอ

• setRequestHeader( label, value )

  เพิ่มคู่ป้ายกำกับ / ค่าในส่วนหัว HTTP ที่จะส่ง

คุณสมบัติ XMLHttpRequest

• onreadystatechange

  ตัวจัดการเหตุการณ์สำหรับเหตุการณ์ที่เกิดขึ้นในทุกการเปลี่ยนแปลงสถานะ

• readyState

  คุณสมบัติ readyState กำหนดสถานะปัจจุบันของอ็อบเจ็กต์ XMLHttpRequest

  ตารางต่อไปนี้แสดงรายการของค่าที่เป็นไปได้สำหรับคุณสมบัติ readyState -

สถานะ	คำอธิบาย
0	คำขอไม่ได้เริ่มต้น
1	ตั้งค่าคำขอแล้ว
2	ส่งคำขอแล้ว
3	คำขออยู่ระหว่างดำเนินการ
4	คำขอเสร็จสมบูรณ์

readyState = 0 หลังจากคุณสร้างอ็อบเจ็กต์ XMLHttpRequest แต่ก่อนหน้านี้คุณได้เรียกใช้เมธอด open ()

readyState = 1 หลังจากที่คุณเรียกเมธอด open () แต่ก่อนที่คุณจะเรียกว่า send ()

readyState = 2 หลังจากที่คุณเรียกส่ง ()

readyState = 3 หลังจากที่เบราว์เซอร์สร้างการสื่อสารกับเซิร์ฟเวอร์แล้ว แต่ก่อนที่เซิร์ฟเวอร์จะตอบสนองเสร็จสิ้น

readyState = 4 หลังจากการร้องขอเสร็จสมบูรณ์และได้รับข้อมูลการตอบกลับจากเซิร์ฟเวอร์อย่างสมบูรณ์

• responseText

  ส่งคืนการตอบกลับเป็นสตริง

• responseXML

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

• status

  ส่งคืนสถานะเป็นตัวเลข (เช่น 404 สำหรับ "Not Found" และ 200 สำหรับ "OK")

• statusText

  ส่งคืนสถานะเป็นสตริง (เช่น "Not Found" หรือ "OK")