AJAX hoạt động như thế nào?

Bản chất của AJAX là gì? Ví dụ: tôi muốn có một liên kết trên trang của mình để khi người dùng nhấp vào liên kết này, một số thông tin sẽ được gửi đến máy chủ của tôi mà không cần tải lại trang hiện tại. Đó có phải là AJAX không?

Tôi đã có thể thực hiện hành vi này bằng cách sử dụng isoframe. Để biết thêm chi tiết, tôi đặt một liên kết (giả sử như một hình ảnh nhỏ) trong một isoframe nhỏ. Khi người dùng nhấp vào liên kết này, trình duyệt chỉ tải lại trang trong isoframe.

Tuy nhiên, tôi nghĩ đó không phải là một cách thanh lịch để đạt được mục tiêu. Tôi nghĩ rằng tôi phải sử dụng AJAX. Làm thế nào nó hoạt động? Việc sử dụng XHTML có thể giải quyết vấn đề được xem xét một cách dễ dàng không? Hay tôi cần sử dụng JavaScripts?

Tôi không cần nhiều. Tôi chỉ muốn có một liên kết nhỏ (sau khi nhấp vào) đã gửi một số thông tin đến máy chủ. Giả sử tôi có "hình ảnh ngôi sao" gần một tin nhắn. Nếu người dùng nhấp vào dấu sao (anh ấy / cô ấy thích thư), ngôi sao sẽ thay đổi màu và cơ sở dữ liệu cập nhật máy chủ của tôi (để nhớ rằng người dùng thích thư).

Nếu bạn hoàn toàn mới sử dụng AJAX (viết tắt của Asynchronous Javascript And XML), mục nhập AJAX trên wikipedia là một điểm khởi đầu tốt:

Giống như DHTML và LAMP, bản thân AJAX không phải là một công nghệ mà là một nhóm các công nghệ. AJAX sử dụng kết hợp:

• HTML và CSS để đánh dấu và tạo kiểu thông tin.
• DOM được truy cập bằng JavaScript để hiển thị động và tương tác với thông tin được trình bày.
• Một phương pháp trao đổi dữ liệu không đồng bộ giữa trình duyệt và máy chủ, do đó tránh tải lại trang. Đối tượng XMLHttpRequest (XHR) thường được sử dụng, nhưng đôi khi một đối tượng IFrame hoặc thẻ được thêm động được sử dụng để thay thế.
• Một định dạng cho dữ liệu được gửi đến trình duyệt. Các định dạng phổ biến bao gồm XML, HTML được định dạng trước, văn bản thuần túy và Ký hiệu đối tượng JavaScript (JSON). Dữ liệu này có thể được tạo động bằng một số hình thức tập lệnh phía máy chủ.

Như bạn có thể thấy, từ quan điểm công nghệ thuần túy, không có gì thực sự mới ở đây. Hầu hết các bộ phận của AJAX đã có mặt ở đó vào năm 1994 (1999 cho XMLHttpRequestđối tượng). Điểm mới thực sự là sử dụng các phần này cùng nhau như Google đã làm với GMail (2004) và Google Maps (2005). Trên thực tế, cả hai trang web đều đóng góp rất nhiều vào việc quảng bá AJAX.

Một bức tranh có giá trị hàng nghìn từ, bên dưới là sơ đồ minh họa giao tiếp giữa máy khách và máy chủ từ xa, cũng như sự khác biệt giữa ứng dụng cổ điển và ứng dụng hỗ trợ AJAX:

Đối với phần màu cam, bạn có thể làm mọi thứ bằng tay (với XMLHttpRequestđối tượng) hoặc bạn có thể sử dụng các thư viện JavaScript nổi tiếng như jQuery , Prototype , YUI , v.v. để "AJAXify" phía máy khách của ứng dụng của bạn. Các thư viện như vậy nhằm mục đích che giấu sự phức tạp của việc phát triển JavaScript (ví dụ: khả năng tương thích giữa nhiều trình duyệt), nhưng có thể quá mức cần thiết cho một tính năng đơn giản.

Ở phía máy chủ, một số khung công tác cũng có thể giúp ích (ví dụ: DWR hoặc RAJAX nếu bạn đang sử dụng Java), nhưng tất cả những gì bạn cần làm về cơ bản là hiển thị một dịch vụ chỉ trả về thông tin cần thiết để cập nhật một phần trang (ban đầu là XML / XHTML - chữ X trong AJAX - nhưng ngày nay JSON thường được ưa chuộng hơn).

Bản chất của AJAX là:

Các trang của bạn có thể duyệt web và cập nhật nội dung của chính chúng trong khi người dùng đang làm những việc khác .

Nghĩa là, javascript của bạn có thể gửi các yêu cầu GET và POST không đồng bộ (thường thông qua một XMLHttpRequestđối tượng) sau đó sử dụng kết quả của các yêu cầu đó để sửa đổi trang của nó (thông qua thao tác Mô hình Đối tượng Tài liệu ).

AJAX thường liên quan đến việc gửi các yêu cầu HTTP từ máy khách đến máy chủ và xử lý phản hồi của máy chủ mà không cần tải lại toàn bộ trang. (Không đồng bộ).

Javascript thường thực hiện việc gửi và nhận phản hồi dữ liệu từ máy chủ (theo truyền thống là XML, thường là các định dạng ít dài dòng hơn như JSON)

Sau đó, Javascript có thể cập nhật động DOM trang để cập nhật chế độ xem của người dùng.

Do đó 'Asychronous Javascript And XML'.

Có các tùy chọn khác để cập nhật chế độ xem của người dùng mà không cần tải lại trang, những thứ như Flash và Applet, nhưng đây không phải là giải pháp tốt cho trường hợp của bạn. Có vẻ như Javascript là con đường để đi. Có rất nhiều thư viện hỗ trợ tốt xung quanh, như jQuery được sử dụng trên trang web này, vì vậy bạn không cần phải tự viết nhiều Javascript.

Ajax không chỉ là tải lại một phần của trang. Ajax là viết tắt của Asynchronous Javascript And Xml.

Phần duy nhất của Ajax mà bạn cần là đối tượng XMLHttpRequest từ javascript. Bạn phải sử dụng nó để tải và tải lại một phần nhỏ của html của bạn dưới dạng div hoặc bất kỳ thẻ nào khác.

Đọc ví dụ đó và bạn sẽ trở nên chuyên nghiệp sớm hơn như bạn nghĩ!

<html>
<body>

<script type="text/javascript">
function ajaxFunction()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {
  // code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else if (window.ActiveXObject)
  {
  // code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
else
  {
  alert("Your browser does not support XMLHTTP!");
  }
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4)
  {
  document.myForm.time.value=xmlhttp.responseText;
  }
}
xmlhttp.open("GET","time.asp",true);
xmlhttp.send(null);
}
</script>

<form name="myForm">
Name: <input type="text" name="username" onkeyup="ajaxFunction();" />
Time: <input type="text" name="time" />
</form>

</body>
</html>

AJAX là viết tắt của Asynchronous Javascript and XML. AJAX hỗ trợ cập nhật một phần các trang mà không cần phải đăng lại toàn bộ trang lên máy chủ.

Có rất nhiều tùy chọn cho AJAX. Hai phần mềm đáng chú ý nhất (được cho là) ​​là ASP.NET AJAX của Microsoft (trước đây là Atlas) và jQuery.

ASP.NET AJAX tương đối dễ cài đặt nếu bạn đã quen với ASP.NET. jQuery rất tốt nếu bạn đã biết javascript và cho phép kiểm soát rất chi tiết việc truy vấn và cập nhật trang của bạn.

HTH

Nếu bạn quan tâm, IBM có loạt bài 10 (có thể nhiều hơn) về Ajax: Làm chủ Ajax phần 1

Mặc dù bây giờ một vài năm, đó là một đoạn giới thiệu tốt, (ngay cả khi bạn chỉ mới đọc phần đầu tiên!)

Tôi nghĩ toàn bộ sê-ri nên được liệt kê Ở đây , mặc dù trang web của tôi hiện tại hơi chậm ...

Tóm lược:

Ajax, bao gồm HTML, công nghệ JavaScript ™, DHTML và DOM, là một cách tiếp cận nổi bật giúp bạn chuyển đổi các giao diện Web thô kệch thành các ứng dụng Ajax tương tác. Tác giả, một chuyên gia về Ajax, trình bày cách các công nghệ này hoạt động cùng nhau - từ cái nhìn tổng quan đến cái nhìn chi tiết - để biến việc phát triển Web cực kỳ hiệu quả trở thành hiện thực dễ dàng. Ông cũng tiết lộ các khái niệm trung tâm của Ajax, bao gồm cả đối tượng XMLHttpRequest.

đó là ajax. bạn không thể sử dụng ajax mà không có javascript. bạn nên xem các ví dụ về jquery và nguyên mẫu để biết cách sử dụng.

Những gì bạn đang cố gắng làm là về mặt kỹ thuật. Ajax tạo các giao dịch phân đoạn xhtml để cập nhật các phần của trang. Javascript làm cho những yêu cầu nhận được này đẹp và gọn gàng.