03AJAX 向服务器发送请求

Posted 2020-06-22 魔芋铃

AJAX 向服务器发送请求

 

创建 XMLHttpRequest 对象后，就可以向服务器发送请求了。

 XMLHttpRequest 对象的 open() 方法和 send() 方法用来向服务器发送请求。

注意：AJAX 向服务器发送的是 http 请求，与我们浏览网页时发送的 http 请求一样。我们可以右键查看当前网页的源代码，由很多 html、CSS和javascript 组成，如果我们使用 AJAX 请求当前的 URL ，返回的内容是一样的。（魔芋：也就是说ajax发送的,和我们平时输入网址是一样的过程）

open() 方法（魔芋：初始化）

open() 方法用来初始化 HTTP 请求参数，但是并不发送请求。

语法：
    open(method,url,async)
参数说明：

参数	说明
method	必须参数。请求的类型，GET 或 POST。
url	必须参数。文件在服务器上的位置。
async	必须参数。是否异步发送请求，true（异步）或 false（同步）。

注意：AJAX 的强大之处在于异步请求，所以 async 一般设置为 true ，否则将失去意义。

例如，向演示文件发送一个类型为 GET 的异步请求：

1. open("GET","/demo/javascript/ajax/ajaxDemo.php?action=getIP",true)

 

send()方法

send() 方法用来向服务器发送 HTTP 请求，并使用传递给 open() 方法的参数。

语法：
    send(string)
其中，string 为发送的内容，该参数仅仅在 POST 请求时有意义。

举例，发送一个类型为 GET 的异步请求：

1. xmlhttp.open("GET","/demo/javascript/ajax/ajaxDemo.php?action=getIP",true);
2. xmlhttp.send();

 

后台接收方式（PHP代码）：

1. if($_GET[\'action\']=="getIP"){
2. $ip=$_SERVER["REMOTE_ADDR"];// 获取 IP
3. echo $ip;
4. }

 

发送一个类型为 POST 的异步请求：

1. xmlhttp.open("POST","/demo/javascript/ajax/ajaxDemo.php",true);
2. xmlhttp.send("action=getIP");

 

后台接收方式（PHP代码）：

1. if($_POST[\'action\']=="getIP"){
2. $ip=$_SERVER["REMOTE_ADDR"];// 获取 IP
3. echo $ip;
4. }

url - 服务器上的文件

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

1. xmlhttp.open("GET","ajax_test.asp",true);

 

该文件可以是任何类型的文件，比如 .txt 和 .xml，或者服务器脚本文件，比如 .asp 和 .php （在传回响应之前，能够在服务器上执行任务）。

 

一个发送 AJAX 请求的完整代码：

1. <script type="text/javascript">
2. var xmlhttp;
3. // 创建 XMLHttpRequest 对象
4. try{
5. // code for IE7+, Firefox, Chrome, Opera, Safari
6. xmlhttp=newXMLHttpRequest();
7. }catch(e){
8. // code for IE6, IE5
9. xmlhttp=newActiveXObject("Microsoft.XMLHTTP");
10. }
11. // 初始化请求参数
12. xmlhttp.open("GET","/demo/javascript/ajax/ajaxDemo.php?action=getIP",true);
13. // 发送请求
14. xmlhttp.send();
15. </script>