AJAX

Asynchronous JavaScript + XML（异步JavaScript和XML），是指一种创建交互式、快速动态网页应用的网页开发技术，无需重新加载整个网页的情况下，能够更新部分网页的技术。

AJAX使用步骤

原生的Ajax使用步骤：

1. 创建XMLHttpRequest 对象

var xhr =new XMLHttpRequest();

2. 向服务器发送请求

xhr.open("请求方式","请求地址"[,true是否异步]);

对于GET请求，需要在地址后面以查询字符串方式加上携带的参数,最后一个参数默认为true，异步

xhr.send();

如果需要像 HTML 表单那样 POST 数据，在send()函数之前用setRequestHeader() 来添加 HTTP 头。 send() 方法中规定您希望发送的数据:

xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xhr.send("fname=Henry&lname=Ford");

3. 获得来自服务器的响应

当请求被发送到服务器时，我们需要执行一些基于响应的任务。 每当 readyState 改变时，就会触发 onreadystatechange事件。 readyState 属性存有 XMLHttpRequest 的状态信息。 下面是XMLHttpRequest 对象的三个重要的属性

属性描述onreadystatechange存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。readyState存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。

0: 请求未初始化 1: 服务器连接已建立 2: 请求已接收 3: 请求处理中 4: 请求已完成，且响应已就绪

xhr.onreadystatechange=function(){ if (xhr.readyState==4 && xhr.status==200){ document.getElementById("myDiv").innerHTML=xhr.responseText; } }

xhr.responseText获得字符串形式的响应数据 responseXML获得 XML 形式的响应数据

4. xhr的其他方法

xhr.abort() 如果请求已被发出，则立刻中止请求。 xhr.onload() 请求成功完成时触发. xhr.onloadend()当请求结束时触发,

Jquery中的Ajax使用步骤：

1.使用方法

$.ajax({ url:"/jquery/test1.txt", async:false, success:function(res){ } });

2. 属性方法设置

async默认值: true,为异步请求。如果需要发送同步请求，请将此选项设置为 false。$.ajaxPrefilter()在每个请求发送之前且被 $.ajax() 处理之前，处理自定义 Ajax 选项或修改已存在选项beforeSend(XHR)发送请求前可修改 XMLHttpRequest 对象的函数，如添加自定义 HTTP 头。XMLHttpRequest 对象是唯一的参数。这是一个 Ajax 事件。如果返回 false 可以取消本次 ajax 请求。cache默认值: true，dataType 为 script 和 jsonp 时默认为 false。设置为 false 将不缓存此页面。complete(XHR, TS)请求完成后回调函数 (请求成功或失败之后均调用)。参数： XMLHttpRequest 对象和一个描述请求类型的字符串。这是一个 Ajax 事件。contentType这个对象用于设置 Ajax 相关回调函数的上下文。也就是说，让回调函数内 this 指向这个对象如果不设定这个参数，那么 this 就指向调用本次 AJAX 请求时传递的 options 参数）data发送到服务器的数据。将自动转换为请求字符串格式。success请求成功后的回调函数。参数：由服务器返回，并根据 dataType 参数进行处理后的数据；描述状态的字符串。type请求方式 (“POST” 或 “GET”)， 默认为 “GET”error请求失败时调用此函数。有以下三个参数：XMLHttpRequest 对象、错误信息、（可选）捕获的异常对象。如果发生了错误，错误信息（第二个参数）除了得到 null 之外，还可能是 “timeout”, “error”, “notmodified” 和 “parsererror”。dataType预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来智能判断

HTTP报文结构

请求消息

由 请求行、请求头部、空行、请求数据 四部分组成

1.请求行

请求行由请求方法字段、URL字段和HTTP协议版本字段3个字段组成，它们用空格分隔。 GET /data/info.html HTTP/1.1

HTTP协议版本有两种：HTTP1.0/HTTP1.1： HTTP1.0对于每个连接都只能传送一个请求和响应，请求完服务器返回响应就会关闭，HTTP1.0没有Host字段。 而HTTP1.1在同一个连接中可以传送多个请求和响应，多个请求可以重叠和同时进行，HTTP1.1必须有Host字段。

2.请求头部

用来描述客户端基本信息，由多行键值对组成

常见的请求头字段含义：

部分头部字段名称描述Accept-Charset浏览器可接受的字符集Accept-Language浏览器所希望的语言种类，当服务器能够提供一种以上的语言版本时要用到Host请求的服务器域名Content-Length表示请求消息正文的长度Accept浏览器可接受的响应内容类型列表Cookie通过这个头可以向服务器带数据User-Agent浏览器类型

3.空行

通过一个空行，告诉服务器请求头部到此为止，分隔作用

4.请求数据

若方法字段是GET，则此项为空，没有数据 若方法字段是POST,则通常来说此处放置的就是要提交的数据

响应消息

响应报文也由三部分组成：响应行、响应头、空行、响应体

1.请求行

响应行一般由协议版本、状态码及其描述组成

HTTP/1.1 200 OK 状态码描述说明1xx这一类型的状态码，代表请求已被接受，需要继续处理，不常见200ok客户端请求成功301Moved Permanently被请求的资源已永久移动到新位置，并且将来任何对此资源的引用都应该使用本响应返回的若干个URI之一302Found在响应报文中使用首部“Location: URL”指定临时资源位置304Not Modified未修改，服务器不会返回任何资源400Bad Request语义有误，一般为参数错误401Unauthorized请求需要用户验证，一般为权限不够403Forbidden服务器已理解，但是拒绝执行404Not Found服务器无法找到请求的URL405Method Not Allowed不允许使用此方法请求相应的URL408Request Timeout请求超时500Internal Server Error服务器内部错误501Internal Server Error服务器不支持改请求方法502Bad Gateway代理服务器从上游收到了一条伪响应503Service Unavailable服务器此时无法提供服务，但将来可能可用

2.响应头

响应头用于描述服务器的基本信息，以及数据的描述，服务器通过这些数据的描述信息，可以通知客户端如何处理等一会儿它回送的数据。

响应头字段描述Allow服务器支持哪些请求方法Content-Length表示内容长度Date当前的GMT时间，例如，Date:Mon,31Dec200104:25:57GMTLast-Modified文档的最后改动时间Set-Cookie设置和页面关联的CookieTransfer-Encoding告诉浏览器数据的传送格式setContentType设置Content-Type头。大多数Servlet都要用到这个方法

3.响应体

响应体就是响应的消息体，如果是纯数据就是返回纯数据，如果请求的是HTML页面，那么返回的就是HTML代码，如果是JS就是JS代码。