码迷,mamicode.com
首页 > Web开发 > 详细

Ajax

时间:2017-04-30 16:06:24      阅读:135      评论:0      收藏:0      [点我收藏+]

标签:信息   设置   var   lan   响应   opened   http   内容   false   

1、同源请求和跨域请求
https://www.baidu.com/
1.网络协议:http https ftp
2域名: n.ews.baidu.com 和 video.baidu.com 是不同域
3.端口号:http默认是80(可以省略不写) https默认是443
跨域:以上三个中的一个不一样就是跨域
同源策略:Ajax 跨域策略:jsonp


1 创建Ajax对象
var xhr = null;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest;
} else {
xhr = new ActiveXObject("MsXML3.XMLHTTP");
}2 打开连接
a、请求的方式:get、post...
get请求的弊端:不安全、大小有限制、有缓存、没有请求的主体
b、API接口URL地址
c、async 设置同步还是异步
true和false 默认是true-->异步 false-->同步
xhr.open("get", "data.txt", true);
3 监听请求-->onreadystatechange

ajax状态
0:UNSENT 未发送
1:OPENED 打开连接
2:HEADERS_RECEIVED 已经接收了头部请求信息
3:LOADING 主体正在请求中
4:DONE 接收完成

b、网络状态码
200:请求成功
301:永久重定向 302:临时重定向 304:数据走的是缓存的数据
400:参数错误,缺少必须的参数 404:未找到资源文件 417:内容过多
500:未知的服务器错误
xhr.onreadystatechange = function () {
var reg = /^(2|3)\d{2}$/;
if (this.readyState === 4 && reg.test(this.status)) {
var date = xhr.getResponseHeader();
console.log(date);
var str = this.responseText;
var obj = null;
try {
obj = JSON.parse(str);
} catch (e) {
obj = eval("(" + str + ")");
}
console.log(obj);
}
};

4.发送请求
get方式不用传递任何的参数,但是post请求需要把传递给后台的数据都当做参数传递进来(json格式的字符串)
post模式中,在send之前我们需要设置响应请求头
xhr.setRequestHeader("Accept-Language", "utf-8");
xhr.send();

 

Ajax

标签:信息   设置   var   lan   响应   opened   http   内容   false   

原文地址:http://www.cnblogs.com/luke-/p/6788827.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!