ajax请求属性,ajax 请求类型
ajax_withCredentials 属性
什么是 credentials
credentials，即用户凭证，是指 cookie、HTTP身份验证和TLS客户端证书。需要注意的是，它不涉及代理身份验证或源标头。
XMLHttpRequest 的 withCredentials 属性
默认值为false。在获取同域资源时设置 withCredentials 没有影响。
ajax会自动带上同源的cookie，不会带上不同源的cookie
可以通过前端设置withCredentials为true， 后端设置Header的方式来让ajax自动带上不同源的cookie，但是这个属性对同源请求没有任何影响， 会被自动忽略。
true：在跨域请求时，会携带用户凭证
false：在跨域请求时，不会携带用户凭证；返回的 response 里也会忽略 cookie
规范文档中描述，它在特定情况下会报错
throws an InvalidStateError exception if state is not unsent or opened, or if the send() flag is set.
这里的 state 是指 XMLHttpRequest 的 readyState 属性，我们来简单回顾一下相关内容。
IE 10
原来，在IE10环境下，withCredentials 属性必须在open方法成功执行之后，send执行之前设置才可以，否则会报错。如果open方法执行失败了，设置 withCredentials 属性依然会报错。
初识ajax
ajax是一种技术方案，但并不是一种新技术。它依赖的是现有的CSS/HTML/JavaScript，而其中最核心的依赖就是浏览器提供的XMLHttpRequest对象，是这个对象使得浏览器可以发出HTTP请求与接收HTTP响应，实现在页面不刷新的情况下和服务端进行数据交互。浏览器升级之后，出现了fetch，也可以认为是ajax的一种实现。（兼容性差）
使用XMLHttpRequest对象来发送一个Ajax请求。
status：200-300表示正常状态码。
status：404表示这个文件不存在。
status：503服务器收到了请求但是内部报错了。
status：304表示这个数据是有缓存的。
readyState：存有XMLHttpRequest的状态。从0~4发生变化
只要readyState属性的值由一个值变成另一个值，都会触发一次readystatechange事件。必须在调用open()之前指定onreadystatechange事件处理程序才能保证跨浏览器兼容性。与其他事件不同的是，这里没有向readystatechange事件处理程序中传递event对象，必须通过XHR对象本身来确定下一步该怎么做。
在接受响应之前，还可以调用abort()方法来取消异步请求，
调用这个方法之后，XHR对象会停止触发事件，而且也不在允许访问任何与响应有关的对象属性。
XMLHttpRequest标准又分为Level 1和Level 2。
1.缺点：
此属性可以设置HTTP请求的时限。与之相关的是timeout()事件，用来指定回调函数。
timeout属性表示请求在等待多少毫秒之后就终止，再给timeout设置一个数值后，如果在规定的时间内浏览器还没有接收到响应，那么就会触发timeout事件，进而会调用ontimeout事件处理程序。如果在超时终止请求之后再访问status属性，就会导致错误。为避免浏览器报告错误，可以将检查status属性的语句封装在一个try-catch语句中。
ajax直接传送FormData对象与点击submit提交网页表单的效果是一样的。
使用FormData的优点：不必明确地在XHR对象上设置请求头部，XHR能够识别传入的数据类型是FormData的实例，并配置适当的头部信息。
假定files是一个"选择文件"的表单元素（input[type="file"]），将它装入FormData对象，之后发送FormData即可实现文件的上传。
作用：指定xhr.response的数据类型。
作用：获取response数据
作用：表示发送数据。
xhr.send(data)的参数data可以是以下几种类型：
阮一峰:XMLHttpRequest Level 2 使用指南
你真的会使用XMLHttpRequest么？
《javascript高级程序设计》
饥人谷前端教程
AJAX请求类实例代码
AJAX请求类实例代码
代码如下:
// AJAX类
function AJAXRequest() {
var xmlObj = false;
var CBfunc,ObjSelf;
ObjSelf=this;
try { xmlObj=new XMLHttpRequest; }
catch(e) {
try { xmlObj=new ActiveXObject("MSXML2.XMLHTTP"); }
catch(e2) {
try { xmlObj=new ActiveXObject("Microsoft.XMLHTTP"); }
catch(e3) { xmlObj=false; }
}
}
if (!xmlObj) return false;
this.method="POST";
this.url;
this.async=true;
this.content="";
this.callback=function(cbobj) {return;}
this.send=function() {
if(!this.method||!this.url||!this.async) return false;
xmlObj.open (this.method, this.url, this.async);
if(this.method=="POST") xmlObj.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlObj.onreadystatechange=function() {
if(xmlObj.readyState==4) {
if(xmlObj.status==200) {
ObjSelf.callback(xmlObj);
}
}
}
if(this.method=="POST") xmlObj.send(this.content);
else xmlObj.send(null);
}
}
AJAX请求类
by HotHeart(热血心肠)
Site:
Blog:
类名：AJAX
创建方法：var ajaxobj=new AJAX;，如果创建失败则返回false
属性：method - 请求方法，字符串，POST或者GET，默认为POST
url - 请求URL，字符串，默认为空
async - 是否异步，true为异步，false为同步，默认为true
content - 请求的内容，如果请求方法为POST需要设定此属性，默认为空
callback - 回调函数，即返回响应内容时调用的函数，默认为直接返回，回调函数有一个参数为XMLHttpRequest对象，即定义回调函数时要这样：function mycallback(xmlobj)
方法：send() - 发送请求，无参数
一个例子：
var ajaxobj=new AJAXRequest; // 创建AJAX对象
ajaxobj.method="GET"; // 设置请求方式为GET
ajaxobj.url="default.asp" // URL为default.asp
// 设置回调函数，输出响应内容
ajaxobj.callback=function(xmlobj) {
document.write(xmlobj.responseText);
}
ajaxobj.send(); // 发送请求 ;
Ajax向服务器发送请求和接收返回的信息
Ajax向服务器发送请求
Ajax对象创建完成后，下面就要讲解一下Ajax如何使用。首先详细讲解一下Ajax向服务器发送请求所需的两个方法，具体如下：
(1)open()方法
open()方法用于创建一个新的HTTP请求，并指定此请求的类型(如GET、POST等)、URL以及验证信息，其声明方式如下所示：
在上述声明中，method用于指定请求的类型，其值可为POST、GET、PUT及PROPFIND，大小写不敏感;URL表示请求的地址，可以为绝对地址也可以为相对地址，并且可以传递查询字符串。其余参数为可选参数，其中，asyncFlagy用于指定请求方式，同步请求为false，默认为异步请求true;userName用于指定用户名，password用于指定密码。
(2)send()方法
send()方法用于发送请求到HTTP服务器并接收回应。其声明方式如下所示：
在上述声明中，content用于指定要发送的数据，其值可为DOM对象的实例、输入流或字符串，一般与POST请求类型配合使用，需要注意的是，如果请求声明为同步，该方法将会等待请求完成或者超时才会返回，否则此方法将立即返回。
需要注意的是，在使用GET方式传递特殊字符或中文参数时，要使用JavaScript中的encodeURIComponent()函数将其转换成“%十六进制数”的形式，防止在某些浏览器(如IE浏览器)中中文乱码的问题。
Ajax接收服务器返回的信息
了解Ajax向服务器发送请求后，下面将对Ajax如何接收服务器返回的信息(例如，HTML标签、CSS样式、字符串、XML、JSON等)，进行详细讲解。具体如下：
(1)readyState属性
readyState属性用于返回Ajax的当前状态，状态值有5种形式，具体如表所示。
(2)onreadystatechange属性
onreadystatechange事件属性用于感知readyState属性状态的改变。为了大家更好的理解这两个属性的使用，下面创建一个服务器端的文件index.php，用于输出字符串，然后在浏览器端index.html中向服务器端发送请求，并在控制台输出状态值。具体示例如下所示：
创建服务器端文件：index.php
创建浏览器端文件：index.html
在浏览器中访问客户端文件，按“F12”键，切换到控制台，查看输出结果，具体如下图所示。
从图中可以看出，通过onreadystatechange事件属性可以清晰的感知Ajax状态的改变，同时使用readyState获取转变后的状态值。例如Ajax从0(未初始化)状态变成1(初始化)状态值时，Ajax此时的状态值为1。
(3)status属性
status属性用于返回当前请求的HTTP状态码，常见的状态码如表所示。
值得一提的是，在感知当前Ajax对象状态时，为了追求程序的严谨性，需要同时判断当前HTTP状态status是否等于200(请求成功)。
需要注意的是，Ajax中的statusText属性，仅当数据发送并接收完毕后，才可以获取当前请求的响应状态。
(4)获取响应信息的相关属性
当数据接收完毕且请求服务器的请求成功时，即可以使用Ajax中提供的相关属性获取服务器的响应信息。具体的属性及相关说明如下表所示。
在上表中，responseText属性用于返回文本格式的响应数据;属性responseBody表示直接从服务器返回并未经解码的二进制数据;responseXML属性用于接收XML数据格式的响应数据。