xhr-get请求

目录

1、创建xhr对象

2、与服务器建立连接

3、发送请求

4、监听请求的readyStateChange事件

---

http://123.57.142.211:8080/api/goodList

1、协议名称(http://)

2、服务器地址：可以是域名，也可以是IP(123.57.142.211)

3、端口号，可以省略，不写端口号，浏览器请求的时候会自动加上端口号，http协议默认的端口号80，https默认端口号是443。(8080)

4、路径：描述了要访问服务器上具体哪个资源。(/api/goodList)

1、2、3都相同为同源，有一个不相同为跨域

1、创建xhr对象

var xhr = new XMLHttpRequest();

2、与服务器建立连接

GET请求携带数据，在url的后面以?链接查询字符串即可

open():与服务器建立连接

para1：请求方式 GET/POST

para2：网址，遵循接口文档。8080：端口号，服务器代码中自定义的

xhr.open(
    "GET",
    "http://123.57.142.211:8080/api/goodList"
);

3、发送请求

xhr.send();

4、监听请求的readyStateChange事件

      状态readystate的取值：

      值            状态                    描述

      0           UNSENT            代理被创建，但尚未调用open()方法

      1           OPENED            open()方法已经被调用

      2           HEADERS_RECEIVED   send()已经被调用，并且头部和状态已经可获得

      3           LOADING           下载中……，responseText属性已经包含了部分数据

      4           DONE                 下载操作完成。

xhr.onreadystatechange = function () {
    console.log(xhr.readyState);
    if (xhr.readyState == 4) {
        // responseText属性中获取成功的数据，JSON格式
        var data = JSON.parse(xhr.responseText);
        console.log(data);
        // 5、后续操作
    }
};