二十五岁时我们都一样愚蠢、多愁善感,喜欢故弄玄虚,可如果不那样的话,五十岁时也就不会如此明智。
标题:JavaScript ajax http send
XMLHttpRequest 对象用于与服务器交换数据。
向服务器发送请求
发送请求到服务器,我们使用XMLHttpRequest对象的open()和send()方法:
xhttp.open("GET", "ajax_info.txt", true); xhttp.send();
方法 描述 open(method, url, async) 指定请求的类型
method: 请求类型: GET 或者 POST
url: 服务器(文件)位置
async: true (异步) 或者 false (同步)send() 将请求发送到服务器 (使用GET) send(string) 将请求发送到服务器 (使用POST)
GET 还是 POST?
GET 比 POST简单并且更快, 并可在大多数情况下使用.
然而,当遇到下列情况时用 POST:
- 不是更新缓存文件(更新服务器上的文件或数据库)
- 向服务器发送大量数据(POST没有大小限制)。
- 发送用户输入(可以包含未知字符),POST比GET更强大和安全.
GET 请求
一个简单的GET请求:
xhttp.open("GET", "demo_get.asp", true); xhttp.send();在上面的例子中,你可能得到一个缓存的结果。为了避免这种情况,添加一个唯一的ID到URL:
xhttp.open("GET", "demo_get.asp?t=" + Math.random(), true); xhttp.send();如果要用GET方法发送信息,请将信息添加到URL:
xhttp.open("GET", "demo_get2.asp?fname=Henry&lname=Ford", true); xhttp.send();
POST 请求
一个简单的POST请求:
xhttp.open("POST", "demo_post.asp", true); xhttp.send();POST 数据像HTML表单, 使用setRequestHeader()添加HTTP头信息. 使用send()方法,指定要发送的数据:
xhttp.open("POST", "ajax_test.asp", true); xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhttp.send("fname=Henry&lname=Ford");
方法 描述 setRequestHeader(header, value) 增加的HTTP头到request
header: 指定header名称
value: 指定header值
url - 服务器上的文件
open() 方法的url参数, 服务器上文件的地址:
xhttp.open("GET", "ajax_test.asp", true);该文件可以是任何类型的文件, 像 .txt 和 .xml, 或服务器脚本文件 .asp 和 .php (可以在发送响应前在服务器上执行操作).
异步 - True 或者 False?
发送一个异步请求, open()方法的async参数可以设置为true或者false:
xhttp.open("GET", "ajax_test.php", true);发送异步请求对web开发人员来说是一个巨大的改进. 服务器上执行的许多任务都非常耗时,在使用AJAX之前,此操作可能会导致应用程序挂起或停止。
通过发送异步的JavaScript,不用等待服务器的响应,而是:
- 在等待服务器响应时执行其他脚本
- 当响应完成,处理响应
Async = true
当使用 async = true, 当在onreadystatechange事件里,响应完成时,执行一个函数:
xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("demo").innerHTML = this.responseText; } }; xhttp.open("GET", "ajax_info.txt", true); xhttp.send();关于onreadystatechange,将在下一章有更多讲述.
Async = false
使用async = false, 修改open()方法的第三个参数为false:
xhttp.open("GET", "ajax_info.txt", false);使用async = false 不推荐, 但对于一些小的请求,是可以的.
记住,JavaScript不会继续执行,直到服务器响应准备。如果服务器忙或慢,应用程序将挂起或停止。
注意: 当你使用async = false, 不实现onreadystatechange函数 - 代码放在send()语句后面:
xhttp.open("GET", "ajax_info.txt", false); xhttp.send(); document.getElementById("demo").innerHTML = xhttp.responseText;