初识axios

什么是 axios？

axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端。简单的理解就是ajax的封装。

特性

• 从浏览器中创建 
• XMLHttpRequests
• 从 node.js 创建 
• http
• 请求
• 支持 
• Promise
•  API
• 拦截请求和响应
• 转换请求数据和响应数据
• 取消请求
• 自动转换 JSON 数据
• 客户端支持防御 
• XSRF

浏览器支持

Latest ✔	Latest ✔	Latest ✔	Latest ✔	Latest ✔	8+ ✔

安装

使用 npm:使用 bower:

npm install axios

bower install axios

案例

执行 GET 请求

// 为给定 ID 的 user 创建请求

axios.get('/user?ID=12345') .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); });

// 上面的请求也可以这样做

axios.get('/user', { params: { ID: 12345 } }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); });

执行 POST 请求

axios.post('/user', { firstName: 'Fred', lastName: 'Flintstone' }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); });

执行多个并发请求

function getUserAccount() { return axios.get('/user/12345'); } function getUserPermissions() { return axios.get('/user/12345/permissions'); } axios.all([getUserAccount(), getUserPermissions()]) .then(axios.spread(function (acct, perms) { // 两个请求现在都执行完成 }));

axios API

可以通过向 axios 传递相关配置来创建请求

axios(config)

// 发送 POST 请求

axios({ method: 'post', url: '/user/12345', data: { firstName: 'Fred', lastName: 'Flintstone' } });

// 获取远端图片

axios({ method:'get', url:'bit.ly/2mTM3nY', responseType:'stream' }) .then(function(response) { response.data.pipe(fs.createWriteStream('ada_lovelace.jpg')) });

axios(url[, config])

// 发送 GET 请求（默认的方法）

axios('/user/12345');

请求方法的别名

为方便起见，为所有支持的请求方法提供了别名

axios.request(config)

axios.get(url[, config])

axios.delete(url[, config])

axios.head(url[, config])

axios.options(url[, config])

axios.post(url[, data[, config]])

axios.put(url[, data[, config]])

axios.patch(url[, data[, config]])

注意

在使用别名方法时， url、method、data 这些属性都不必在配置中指定。

并发

处理并发请求的助手函数

axios.all(iterable)

axios.spread(callback)

*前端萌新收集编辑，待完未续