JS--AJAX建立XMLHttpRequest连接、发送GET请求、发送POST请求
建立XMLHttpRequest连接
创建XMLHttpRequest对象之后，就可以使用该对象的open()方法建立一个HTTP请求。open()方法用法如下：
oXMLHttpRequest.open.(bstrMethod, bstrUrl, varAsync, bstrUser, bstrPassword);
该方法包含5个参数，其中前两个参数是必须的。
- bstrMethod： HTTP方法字符串，如GET、POST等，大小写不敏感
- bstrUrl： 请求的URL地址字符串，可以为绝对地址或相对地址
- varAsync： 布尔值，可选参数，指定请求是否为异步方式。默认为true。如果为真，当状态改变时会调用onreadystatechange属性指定的回调函数
- bstrUser： 可选参数，如果服务器需要验证，该参数指定用户名，如果未只当，当服务器需要验证时，会弹出验证窗口
- **bstrPassword：**可选参数，验证信息中的密码部分，如果用户名为空，则此值将被忽略
建立连接之后，就可以使用send()方法发送请求到服务器端，并接收服务器的响应。send()方法用法如下：
XMLHttpRequest.send(varBody);//varBody表示将通过该请求发送的数据，如果不传递信息，可以设置参数为null
该方法的同步或异步取决于open方法中的BAsync参数，如果bAsync == False，此方法将会等待请求完成或者超时时才会返回，如果bAsync == True，此方法将立即返回。
使用XMLHttpRequest对象的responseBody、responseStream、responseText或responseXML属性可以接收响应数据。
示例：
<h1>AJAX测试</h1><button id="btn" value="btn" onclick="f()">按钮</button><script> function f() { var ajax = createXMLHTTPObject(); ajax.open("get", "response.jsp",false); ajax.send(null); alert(ajax.responseText); } </script>
response.jsp:
ajax响应
点击按钮，弹出提示框：
发送GET请求
发送GET请求时，只需要将包含查询字符串的URL传入open()方法，设置第一个参数值为“GET”即可。服务器能够在URL尾部的查询字符串中接收用户传递过来的信息。
示例：
<h1>AJAX测试</h1><button id="btn" value="btn" onclick="f()">按钮</button><script> function f() { var ajax = createXMLHTTPObject(); ajax.open("get", "response.jsp?name=zhangsan",false); ajax.send(null); alert(ajax.responseText); } </script>
response.jso：
<%String name = request.getParameter("name");response.getWriter().write(name);%>
点击按钮：弹出提示框显示查询信息：
注意：查询字符串通过（？）前缀附加在URL的末尾，发送数据是以连字符（&）连接的一个或多个键值对。每个名称和值都必须在编码后才能用在URL中，用户使用JavaScript的encodeURLComponent()函数对其进行编码，服务器端在接收这些数据时也必须使用decodeURIComponent()函数进行解码。URL的最大长度为2048字符（2KB）。
发送POST请求
POST请求支持发送任意格式、任意长度的数据，一般多用于表单提交。于GET发送的数据格式相似，POST发送的数据也必须进行编码，并用连字符（&）进行分割，格式如下：
send("key1=value1&key2=value2&...");//这些参数在发送POST请求时，不会被附加到URL的末尾，而是作为send()方法的参数进行传递
注意：使用POST发送请求需要设置响应头信息
xmlhttp.setRequestHeader("Header-name", "value");
一般我们设置的是：content-type，传输数据类型，即服务器需要我们传送的数据类型
xmlhttp.setRequestHeader ("content-type", "application/x-www-form-urlencoded" )//表示传递的是表达值
用于发送POST请求的数据类型（Content Type）通常是application/x-www-form-urlencoded，这意味着我们还可以text/xml或application/xml类型给服务器发送XML数据，甚至可以以application/json 类型发送JavaScript对象。
示例：
<h1>AJAX测试</h1><button id="btn" value="btn" onclick="f()">按钮</button><script> function f() { var ajax = createXMLHTTPObject(); ajax.open("post", "response.jsp",false); ajax.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); ajax.send("name=Tom"); alert(ajax.responseText); } </script>
response.jso：
<%String name = request.getParameter("name");response.getWriter().write(name);%>
点击按钮：弹出提示框显示查询信息：
GET与POST方式对比
使用GET方式传递的信息量是有限的，而使用POST方式传递的信息是无限的，且不受字符编码的限制，还可以传递二进制数据。对于传输文件，以及大容量信息时应采用POST方式。另外，当发送安全信息或XML格式数据时，也应该考虑选用这种方案来实现。
桃扇骨
分手后的思念是犯贱
深藏阁楼爱情的钟
还没有评论，来说两句吧...