Nhập môn AJAX (9)

Đối tượng XMLHttpRequest – Giới thiệu.

Bây giờ ta sẽ xét vấn đề trọng tâm của Ajax: đối tượng XMLHttpRequest. XMLHttpRequest được đưa ra ban đầu trong Internet Explorer 5 như là một ActiveX component. Nó chỉ hoạt động trong Internet Explorer điều này làm cho số ít các nhà phát triển làm việc với XMLHttpRequest, cho tới khi nó trở thành một chuẩn không chính thức trong Mozilla 1.0 và Safari 1.2. Một điều rất quan trọng cần chú ý là XMLHttpRequest không là chuẩn của W3C, mặc dù rất nhiều chức năng của nó được đề xuất trong các đặc tả: DOM Level 3 Load and Save Specification.

Vì XMLHttpRequest không phải là một chuẩn, nên có những sự khác biệt nhỏ trong các trình duyệt về hỗ trợ đối tượng này, tuy nhiên hầu hết các phương thức và thuộc tính của nó đều được hỗ trợ. Hiện thời, Firefox, Safari, Opera, Konqueror, và Internet Explorer tất cả đều hỗ trợ XMLHttpRequest tương tự nhau. Nếu một số lượng người dùng đáng kể vẫn truy cập website với các trình duyệt phiên bản cũ, thì phải cân nhắc về sự lựa chọn công nghệ sẽ ứng dụng.

Giới thiệu về XMLHttpRequest

Trước tiên cần tạo một đối tượng XMLHttpRequest bằng JavaScript trước khi sử dụng đối tượng này để gửi request và xử lý các response. XMLHttpRequest chưa là chuẩn của W3C, vì thế phải dùng JavaScript theo nhiều cách để tạo một thể hiện của của XMLHttpRequest. Internet Explorer thực thi XMLHttpRequest như một đối tượng ActiveX, và các trình duyệt khác như Firefox, Safari, và Opera thực thi nó như một đối tượng JavaScript nguyên thủy. Vì sự khác nhau này, đoạn mã JavaScript phải chứa các cấu trúc logic để tạo một thể hiện của XMLHttpRequest dùng kỹ thuật ActiveX hay đối tượng JavaScript nguyên thủy.

Rất may mắn, trong trường hợp này không cần phải viết mã một cách tỉ mỉ để xác định kiểu trình duyệt và làm thế nào để tạo một thể hiện của đối tượng XMLHttpRequest. Công việc chỉ đơn giản là kiểm tra sự hỗ trợ đối tượng ActiveX của trình duyệt. Nếu hỗ trợ ActiveX, thì tạo một đối tượng XMLHttpRequest dùng ActiveX. Trường hợp khác, tạo đối tượng này bằng kỹ thuật tạo đối tượng JavaScript nguyên thủy. Đoạn mã JavaScript sau dễ dàng tạo ra các thể hiện của đối tượng XMLHttpRequest mà không quan tâm tới trình duyệt.

Tạo một thể hiện của đối tượng XMLHttpRequest:

var xmlHttp;
function createXMLHttpRequest() {
   if (window.ActiveXObject) {
      xmlHttp = new ActiveXObject(“Microsoft.XMLHTTP”);
   }
   else if (window.XMLHttpRequest) {
      xmlHttp = new XMLHttpRequest();
   }

Việc tạo một đối tượng XMLHttpRequest khá là đơn giản. Trước tiên, tạo một biến toàn cục (giả sử có tên là) xmlHttp để lưu trữ một tham chiếu đến đối tượng. Phương thức createXMLHttpRequest thực hiện việc tạo một thể hiện của XMLHttpRequest. Đoạn chương trình này chứa một câu lệnh rẽ nhánh đơn giản để xác định cách thức tạo một đối tượng.

Lệnh gọi window.ActiveXObject sẽ trả về một biến kiểu object hay giá trị null, tương đương với điều kiện true hay false của câu lệnh if, đây là dấu hiệu chỉ ra cho ta biết trình duyệt hỗ trợ ActiveX control, đó là Internet Explorer. Nếu thế, XMLHttpRequest được tạo ra là một thể hiện của ActiveXObject, truyền một chỉ báo kiểu string để xác định loại đối tượng ActiveX cần tạo. Trong thể hiện này, ta cung cấp tham số Microsoft.XMLHTTP cho hàm tạo, để chỉ ra rằng cần tạo một thể hiện của XMLHttpRequest.

Nếu lệnh gọi tới window.ActiveXObject không được thực thi (điều kiện false của lệnh if), lệnh JavaScript sẽ rẽ nhánh tương ứng với lệnh else, để xác định rằng trình duyệt thực thi XMLHttpRequest dưới dạng một đối tượng JavaScript nguyên thủy. Nếu window.XMLHttpRequest tồn tại, sau đó một thể hiện của XMLHttpRequest được tạo ra.

Kiểu dữ liệu XMLHttpRequest của JavaScript tương thích với rất nhiều trình duyệt khác nhau, có thể truy cập các thuộc tính và phương thức của một thể hiện của XMLHttpRequest mà không cần quan tâm tới cách tạo các thể hiện này. Điều này làm cho việc phát triển các ứng dụng đơn giản hơn và làm cho JavaScript không phụ thuộc vào trình duyệt cụ thể.