js调用接口

一、XMLHttpRequest （无需引入外部库）

1.创建XMLHttpRequest对象

var xhr = new XMLHttpRequest();

2.建立连接

xhr.open(method, url, async, username, password);

async默认为true，username和password为可选参数

3.发送请求

xhr.send(body);

参数 body 表示将通过该请求发送的数据，如果不传递信息，可以设置为 null 或者省略。

4.接收响应数据

可以使用 XMLHttpRequest 对象的 responseBody、responseStream、responseText 或 responseXML 属性等待接收响应数据

5.例子

①post请求需要设置请求头的格式内容：xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
②post请求参数放在send里面

• getAllResponseHeaders()：获取响应的 HTTP头部消息。
• getResponseHeader(“Header-name”)：获取指定的 HTTP 头部消息。

二、jQuery或Ajax（引入jQuery库）

在旧浏览器页面在向服务器请求数据时，因为返回的是整个页面的数据，页面都会强制刷新一下，这对于用户来讲并不是很友好。并且我们只是需要修改页面的部分数据，但是从服务器端发送的却是整个页面的数据，十分消耗网络资源。而我们只是需要修改页面的部分数据，也希望不刷新页面，因此异步网络请求就应运而生。

Ajax(Asynchronous JavaScript and XML)：
异步网络请求。Ajax能够让页面无刷新的请求数据。

实现ajax的方式有多种，如jQuery封装的ajax，原生的XMLHttpRequest，以及axios。

1.get请求

2.post请求

后端接收json或RequestBody时

三、axios（引入axios库）

Axios（ajax i/o system）：
这不是一种新技术，本质上还是对原生XMLHttpRequest的封装，可用于浏览器和nodejs的HTTP客户端

1.get请求

2.post请求

3.请求拦截器

4.响应拦截器

5.取消拦截

6.错误处理