HTTP请求封装：AjaxRESTful API及Promise

Posted 2020-09-27 杨 小匠

一、HTTP请求

　　HTTP即超文本传输协议，用以进行html 文件、 图片文件、 查询结果等的网络传输。

• 一个完整的HTTP请求包括：请求行、请求头、空行和请求数据（请求数据可以为空）
• HTTP请求方式有：GET, POST, PUT, HEAD, DELETE, CONNECT, TRACE, OPTIONS

　　请求行和请求头里包含URL、Request Method、Accept、Cookie、User Agent等等信息。实际使用中，即使只确定一个url，客户端也会发出完整的HTTP请求。服务端也会返回HTTP响应（Response），包含响应正文以及Status Code、Content Type、Date等等信息。其中状态码（Status Code）常见的有：

• 200  请求成功
• 400  客户端请求的语法错误，服务器无法理解
• 401  权限错误，身份认证失败
• 404  请求的资源（网页等）不存在
• 500  内部服务器错误 

二、Ajax技术

　　原始的网页开发方式是前后端合一的，代码写在一起，我请求一个地址，服务器就以相应正文的形式返回给我一个页面。Ajax的出现就改变了这一现象，我们可以借此获取所需的特定数据，在不重载整个页面的情况下进行数据更新。

var xmlhttp;
if (window.XMLHttpRequest) {
    xmlhttp = new XMLHttpRequest();// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
}
else {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");// IE6, IE5 浏览器执行代码
}
xmlhttp.onreadystatechange = function () {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
    }
}
xmlhttp.open("GET", "/try/ajax/ajax_info.txt", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send();

　　如上例所示，Ajax中最重要的就是XMLHttpRequest对象，它以多种方法来定义HTTP请求、处理HTTP响应：