get请求
function getJSON (url) {
return new Promise( (resolve, reject) => {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.onreadystatechange = function () {
// xhr 为 this
var resJson;
if (this.readyState === 4) {
if (this.status === 200) {
resolve(this.responseText, this);
} else {
resJson = { code: this.status, response: this.response };
reject(resJson, this);
}
}
}
xhr.send();
});
}
Post请求
function postJSON(url, data) {
return new Promise( (resolve, reject) => {
var xhr = new XMLHttpRequest();
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function () {
var resJson;
if (this.readyState === 4) {
if (this.status === 200) {
resolve(JSON.parse(this.responseText), this);
} else {
resJson = { code: this.status, response: this.response };
reject(resJson, this);
}
}
}
xhr.send(JSON.stringify(data));
})
}
调用实例
var test = getJSON(url);
test.then(function(response){
console.log("success");
}).catch(function(err) {
console.log(err);
});
其中
if (window.XMLHttpRequest) {
// code for all new browsers
xml=new XMLHttpRequest();
} else if (window.ActiveXObject) {
// code for IE5 and IE6
xml=new ActiveXObject("Microsoft.XMLHTTP");
}
readyState:
0=>初始化 1=>载入 2=>载入完成 3=>解析 4=>完成
0-UNINITIALIZED:XML 对象被产生,但没有任何文件被加载。
1-LOADING:加载程序进行中,但文件尚未开始解析。
2-LOADED:部分的文件已经加载且进行解析,但对象模型尚未生效。
3-INTERACTIVE:仅对已加载的部分文件有效,在此情况下,对象模型是有效但只读的。
4-COMPLETED:文件已完全加载,代表加载成功