AJAX以及HTTP

ajax:Asynchronous JavaScript and XML （异步的JavaScript和XML）

环境:需要在搭建的服务器下运行

http是计算机通过网络进行通信的规则 浏览器想服务器请求信息和服务 http是一种无状态的协议

一个完整的HTTP请求有7个步奏

1.建立tcp连接

2.web浏览器向web服务器发送请求命令

3.web浏览器发送请求头信息

4.web服务器应答

5.web服务器发送应答头信息

6.web服务器向浏览器发发送数据

7.web服务器关闭tcp连接

一个http请求一般由四部分组成

1.Http请求的方法或动作，比如是GET还是POST请求

2.正在请求的URL,总得知道请求的地址是什么

3.请求头，包含一些客户端环境信息，身份验证信息等

4.请求体，也就是请求正文

get:一般用于信息获取 使用URL传递参数 对所发送的信息的数量也有限制，一般在2000个字符左右

post:一般用于修改服务器上的资源 对所发送信息的数量无限制

一个HTTP响应一般由3部分组成

1.一个数字和文字组成的状态码，用来显示请求是成功还是失败

2.响应头。响应头也和请求头一样包含许多有用的信息。列如服务器类型 日期时间 内容类型和长度等

3.响应体，也就是响应正文。

http状态码有3位数子构成，其中首位数字定义了状态码的类型：

1xx:信息类，表示收到web浏览器的请求

2xx:成功，表示用户请求被正确接收，理解和处理；列如200 ok

3xx:重定向，表示请求没有成功，客户必须采取进一步动作

4xx:客户端错误，表示客户端提交的请求有错误；；列如404 not found

5xx:服务器错误，表示服务器不能完成请求的处理；列如500

创建XMLHttpRequest对象

if(window.XMLHttprequest){

request=new XMLHttpRequest();

}else{

request=new ActiveXObject("Microsoft.XMLHTTP");//ie5 ie6

}

发送请求

open(method,url,async)//open("get","get.php")

send(string)//post方式 string必填

当是post请求时

reques.open("POST","create.php",true);

request.setRequestHeader("Content-type","application/x-www-form-urlencoded");

request.send("name=小谢&age=28");

当是post 方式的请求时需要设置响应头的信息。get方式的请求不需要

获得相应

responseText:获得字符串形式的响应数据

respinse.XML:获得XML形式的相应数据

status和statusText:以数字和文本的形式返回http状态码

getAllRespinseHeader():获得所有的响应报头

getRespinseHeader():查询相应中的某个字段的值

监听readystate属性

：请求未初始化，open还没被调用

1：服务器连接已建立，open已经建立

2：请求已接收，也就是接收到了头信息

3：请求处理中，也就是接收到响应主体了

4：请求完成，且响应已就绪，也就是响应完成了

基本上一个AJAX程序是这样的步奏

var request=new XMLHttpRequest();//创建requeat对象

request.open("GET","get.php",true);//get方式的请求以及请求的地址和类型

request.send();//发送请求

request.onreadyStatechange=function(){ //监听事件

if(request.readyState===4&&request.status===200){ //当响应完成并且用户请求被陈宫接收

request.responseText;//返回的相应内容文本的形式

}

}

对于JSON数据的解析eval() JSON.parse()

var jsondate='{"infour":[{"name":"小谢","age":27},{"name":"小德","age":26},{"name":"小勇","age":25}]}';

var jsonobj=eval('('+jsondate+')');//eval()函数解析

jsonobj.infour[0].name;

var jsonobj1=JSON.parse()

jsonobj1.infour[0].name;

对于evlal()方法需要注意，如果有恶意代码，先执行代码 再解析代码 不推荐用eval()

jsonlint.com 在线的json校验工具

跨域

1代理的方式，需要在后台服务器设置

2.JSONP的方式，和Jquery结合使用，只支持get方式的跨域

3.html5 支持XHR2:XMLHttprequest Level2'' 已经实现跨域访问。只需在服务器端做小小的改动即可,在后台文件头部声明即可

header('Access-Control-Allow-Origin:*');

hesder('Access-Cortrol-Allow-Metnods:POST,GET');