Bài Ajax 04: XMLHttpRequest trong Ajax

0
248

Xin chào các bạn, trong bài học ngày hôm nay mình sẽ giới thiệu đến các bạn XMLHttpRequest trong Ajax.

Đối tượng XMLHttpRequestchìa khóa của AJAX. Nó đã có sẵn kể từ khi Internet Explorer 5.5 được phát hành vào tháng 7 năm 2000, nhưng không được biết đến nhiều cho đến khi AJAX và Web 2.0 vào năm 2005 trở nên phổ biến.

XMLHttpRequest (XHR) là một API có thể được sử dụng bởi JavaScript, JScript, VBScript và các ngôn ngữ lập trình web khác để chuyển và thao tác dữ liệu XML đến máy chủ và từ máy chủ web bằng HTTP, thiết lập kênh kết nối độc lập giữa Máy khách của trang web và máy chủ.

Dữ liệu được trả về từ các lần gọi XMLHttpRequest thường sẽ được cung cấp bởi các cơ sở dữ liệu phụ trợ. Ngoài XML, XMLHttpRequest có thể được sử dụng để tìm nạp dữ liệu ở các định dạng khác, ví dụ: JSON hoặc thậm chí là một văn bản đơn thuần.

Bạn đã thấy một vài ví dụ về cách tạo một đối tượng XMLHttpRequest.

Dưới đây là một số phương pháp và thuộc tính mà bạn cần làm quen.

Các phương thức XMLHttpRequest 

  •  abort(): Hủy yêu cầu hiện tại.
  • get ALLResponseHeaders(): Trả về bộ tiêu đề HTTP hoàn chỉnh dưới dạng chuỗi.
  • getResponseHeader(titleName): Trả về giá trị của tiêu đề HTTP được chỉ định.
  • open(method, URL)
  • open( method, URL, async)
  • open( method, URL, async, userName )
  • open( method, URL, async, userName, password)

Chỉ định phương thức, URL và các thuộc tính tùy chọn khác của yêu cầu.

Tham số method có thể có giá trị “GET“, “POST” hoặc “HEAD“.

Tham số “async” chỉ định xem yêu cầu có được xử lý không đồng bộ hay không. “true” có nghĩa là quá trình xử lý tập lệnh tiến hành sau phương thức send() mà không cần chờ phản hồi và “false” có nghĩa là tập lệnh cần phải chờ phản hồi trước khi tiếp tục xử lý tập lệnh.

  • send( content ): Gửi yêu cầu.
  • setRequestHeader( label, value ): Thêm một cặp label/values vào tiêu đề HTTP sẽ được gửi.

Các thuộc tính XMLHttpRequest 

  • onreadystatechange: Một trình xử lý sự kiện cho một sự kiện diễn ra ở mọi thay đổi trạng thái.
  • readyState: Thuộc tính readyState định nghĩa trạng thái hiện tại của đối tượng XMLHttpRequest.

Bảng sau đây cung cấp danh sách các giá trị có thể có cho thuộc tính readyState:

StateMô tả
0Yêu cầu không được khởi tạo.
1Yêu cầu đã được thiết lập.
2Yêu cầu đã được gửi.
3Yêu cầu đang trong tiến trình.
4Yêu cầu được hoàn thành.

readyState = 0 Sau khi bạn đã tạo đối tượng XMLHttpRequest, nhưng trước khi bạn gọi phương thức open().

readyState = 1 Sau khi bạn đã gọi phương thức open(), nhưng trước khi bạn gọi send().

readyState = 2 Sau khi bạn đã gọi send().

readyState = 3 Sau khi trình duyệt đã thiết lập giao tiếp với máy chủ, nhưng trước khi máy chủ hoàn thành phản hồi.

readyState = 4 Sau khi yêu cầu được hoàn thành và dữ liệu phản hồi đã được nhận hoàn toàn từ máy chủ.

Kết luận

Như vậy trong bài học ngày hôm nay mình đã giới thiệu đến các bạn XMLHttpRequest trong Ajax. Trong bài học tiếp theo chúng ta sẽ cùng nhau tìm hiểu về Hoạt động của cơ sở dữ liệu trong Ajax.

Chúc các bạn học tập tốt!

BÌNH LUẬN

Vui lòng nhập bình luận của bạn
Vui lòng nhập tên của bạn ở đây