一个Ajax建立的过程是怎样的,主要用到哪些状态码

2017-09-25  本文已影响0人  电影里的梦i

ajax:在不切换页面的情况下完成异步的HTTP请求

(1)创建XMLHttpRequest对象,也就是创建一个异步调用对象.

(2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息.

(3)设置响应HTTP请求状态变化的函数.

(4)发送HTTP请求.

(5)获取异步调用返回的数据.

(6)使用JavaScript和DOM实现局部刷新.

1

2

3

4

5

6

7

8

9

10

11

12

13

var xmlHttp = new XMLHttpRequest();

xmlHttp.open('GET','demo.php','true');

xmlHttp.send()

xmlHttp.onreadystatechange = function(){

if(xmlHttp.readyState === 4 & xmlHttp.status === 200){

}

}

使用promise封装

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

function getJSON(url) {

return new Promise(function(resolve, reject) {

var XHR = new XMLHttpRequest();

XHR.open('GET', url, true);

XHR.send();

XHR.onreadystatechange = function() {

if (XHR.readyState == 4) {

if (XHR.status == 200) {

try {

var response = JSON.parse(XHR.responseText);

resolve(response);

} catch (e) {

reject(e);

}

} else {

reject(new Error(XHR.statusText));

}

}

}

})

}

getJSON(url).then(res => console.log(res));

当前状态readystate

0 代表未初始化。 还没有调用 open 方法

1 代表正在加载。 open 方法已被调用,但 send 方法还没有被调用

2 代表已加载完毕。send 已被调用。请求已经开始

3 代表交互中。服务器正在发送响应

4 代表完成。响应发送完毕

常用状态码status

404 没找到页面(not found)

403 禁止访问(forbidden)

500 内部服务器出错(internal service error)

200 一切正常(ok)

304 没有被修改(not modified)(服务器返回304状态,表示源文件没有被修改)

上一篇 下一篇

猜你喜欢

热点阅读