AJAX - 发送请求至服务器

XMLHttpRequest 对象用于与服务器交换数据。

向服务器发送请求

为了向服务器发送请求，我们使用 XMLHttpRequest 对象的 open() 和 send() 方法：

获取还是发布？

GET 比 POST 更简单、更快，并且可以在大多数情况下使用。

但是，在以下情况下请始终使用 POST 请求：

• 缓存文件不是一个选项（更新服务器上的文件或数据库）。
• 向服务器发送大量数据（POST没有大小限制）。
• 发送用户输入（可能包含未知字符）时，POST 比 GET 更稳健、更安全。

获取请求

一个简单的 GET 请求：

在上面的示例中，您可能会得到缓存的结果。为了避免这种情况，请向 URL 添加唯一 ID：

如果要使用 GET 方法发送信息，请将信息添加到 URL 中：

发布请求

一个简单的 POST 请求：

要像 HTML 表单一样 POST 数据，请使用 setRequestHeader() 添加 HTTP 标头。在send()方法中指定要发送的数据：

url - 服务器上的文件

open() 方法的 url 参数是服务器上文件的地址：

该文件可以是任何类型的文件，例如 .txt 和 .xml，也可以是服务器脚本文件，例如 .html 和 .html（可以在发回响应之前在服务器上执行操作）。

异步——正确还是错误？

服务器请求应该异步发送。

open() 方法的 async 参数应设置为 true：

通过异步发送，JavaScript 不必等待服务器响应，而是可以：

• 等待服务器响应时执行其他脚本
• 响应准备好后处理响应

onreadystatechange 属性

使用 XMLHttpRequest 对象，您可以定义一个在请求收到响应时执行的函数。

该函数定义在就绪状态改变XMLHttpResponse 对象的属性：

上面示例中使用的 "ajax_info.txt" 文件是一个简单的文本文件，如下所示：

您将在后面的章节中了解有关 onreadystatechange 的更多信息。

同步请求

要执行同步请求，请将 open() 方法中的第三个参数更改为 false：

有时 async = false 用于快速测试。您还会在较旧的 JavaScript 代码中找到同步请求。

由于代码将等待服务器完成，因此不需要 onreadystatechange 函数：