3-2 http,get,post

1.http请求

定义:http计算机通过网络进行通信的规则

2.请求响应

• open(method,url,asyn)
  asyn值默认为true
• send()
• onreadystatechange

3.一个完整的ajax的步骤

1.创建ajax核心对象

2.与服务器建立连接

3.发送请求 （url type:”get” dataType:”jsonp”）

4.响应

4.get和post的区别

1.从可见性 get方式传递的参数,是跟着url地址后面 post传递的参数是不可见
2.安全性
3.传递数据量大小 get有限制,post无限制
_

get请求

var url = "https://www.easy-mock.com/mock/5bac6df10132334db7167178/testDemo/testDemo";
        var xhr = new XMLHttpRequest();
        xhr.open('get',url,true);
        xhr.send();
        xhr.onreadystatechange = function(){
            if(xhr.readyState ==  4 && xhr.status == 200){
                var txt = JSON.parse(xhr.responseText);
                console.log(txt);
            }
        }

JSON.parse()方法将json对象解析为JavaScript对象。
JSON.stringify()将javascript的值,转换为JSON字符串。

• responseText:获取字符串形式的响应数据
  
• status:以数字形式返回http的状态码
  
• readystate值代表服务器响应的变化

post请求

Post方式要设置一个请求头

<div id="test"></div>
<script>
var test = document.getElementById("test");
var xhr = new XMLHttpRequest();
xhr.open("post","https://www.easy-mock.com/mock/5b230e1e6bed703a9b488c69/www.getTest.com/push",true);
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.send(null);
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4 && xhr.status == 200){
    var data = JSON.parse(xhr.responseText);
    test.innerHTML = data.data.content
    }
}
</script>