第三章 AJAX

一，ajax

1-1.ajax的概念:

        ajax是一种用于与后台进行异步数据交互的技术，称之为"异步的javascript and xml"

        全称：Asynchronous javascript and xml,是一种在无需重新加载整个网页的情况下，能够更新网页局部数据的技术。

1-2.ajax的优势：

        按需取数据。

        页面无刷新。

        减少带宽，降低成本

        请求速度快

        提升用户体验。

1-3.ajax原理：

    客户端通过XMLHttpRequest向服务器发送一个请求，服务器响应数据，返回给XMLHttpRequest，在XMLHttpRequest对象的成功回调中通过DOM操作把数据展示在页面

1-4.请求步骤：

a.创建一个XMLHttpRequest对象    

        var xhr = new XMLHttpRequest();

    老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象：

        variable=new ActiveXObject("Microsoft.XMLHTTP");

    兼容写法：

     var xhr = null;                                               

        if(window.XMLHttpRequest){        

                xhr = new XMLHttpRequest();

         }else{       

                 xhr = new ActiveXObject("Microsoft.XMLHTTP");      

         }

b,调用xhr的open方法

c,调用xhr的send方法

d,对请求状态监听

1-5：ajax的readyState状态

1-6： http响应状态码说明：        

          1**：请求收到，继续处理

          2**：操作成功收到，分析、接受

          3**：完成此请求必须进一步处理

          4**：请求包含一个错误语法或不能完成

          5**：服务器执行一个完全有效请求失败

          100——客户必须继续发出请求

          101——客户要求服务器根据请求转换HTTP协议版本

          200——交易成功

          201——提示知道新文件的URL

          202——接受和处理、但处理未完成

          203——返回信息不确定或不完整

          204——请求收到，但返回信息为空

          205——服务器完成了请求，用户代理必须复位当前已经浏览过的文件

          206——服务器已经完成了部分用户的GET请求

          300——请求的资源可在多处得到

          301——删除请求数据

          302——在其他地址发现了请求数据

          303——建议客户访问其他URL或访问方式

          304——客户端已经执行了GET，但文件未变化

          305——请求的资源必须从服务器指定的地址得到

          306——前一版本HTTP中使用的代码，现行版本中不再使用

          307——申明请求的资源临时性删除

          400——错误请求，如语法错误

          401——请求授权失败

          402——保留有效ChargeTo头响应

          403——请求不允许

          404——没有发现文件、查询或URl

          405——用户在Request-Line字段定义的方法不允许

          406——根据用户发送的Accept拖，请求资源不可访问

          407——类似401，用户必须首先在代理服务器上得到授权

          408——客户端没有在用户指定的饿时间内完成请求

          409——对当前资源状态，请求不能完成

          410——服务器上不再有此资源且无进一步的参考地址

          411——服务器拒绝用户定义的Content-Length属性请求

          412——一个或多个请求头字段在当前请求中错误

          413——请求的资源大于服务器允许的大小

          414——请求的资源URL长于服务器允许的长度

          415——请求资源不支持请求项目格式

          416——请求中包含Range请求头字段，在当前请求资源范围内没有range指示值，请求也不包含If-Range请求头字段

          417——服务器不满足请求Expect头字段指定的期望值，如果是代理服务器，可能是下一级服务器不能满足请求

          500——服务器产生内部错误

          501——服务器不支持请求的函数

          502——服务器暂时不可用，有时是为了防止发生系统过载

          503——服务器过载或暂停维修

          504——关口过载，服务器使用另一个关口或服务来响应用户，等待时间

二，编写接口

         date_default_timezone_set('PRC');   //设置为中国时区

         echo date("Y-m-d H-i-s",time());   //输出当前时间

?>

ajax请求，输出接口响应的的时间显示在页面

三.缓存处理：

        以上代码，在ie中输出的一直是第一次请求的时间，刷新页面无效，原因是：在默认情况下，IE会针对请求地址缓存Ajax请求的结果。换句话说，在缓存过期之前，针对相同地址发起的多个Ajax请求，只有第一次会真正发送到服务端。在某些情况下，这种默认的缓存机制并不是我们希望的

处理办法：在url后跟随一个随机数或当前时间毫秒数，因为这个值的不同，浏览器会认为这个请求是一个与上一次不同的请求。

四ie的编码处理

        在get请求中，ie返回的是浏览器编码后的字符，因此需要对中文进行URI转码处理，再发送请求

五.post请求

六.data参数序列化

七.get请求封装

八.post请求封装

九.完全封装

十，用户名唯一验证

十一，搜索下拉提示

十二，瀑布流（面向对象）