# axios
Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。
axios 特性
- 从浏览器中创建 XMLHttpRequests
- 从 node.js 创建 http 请求
- 支持 Promise API
- 拦截请求和响应
- 转换请求数据和响应数据
- 取消请求
- 自动转换 JSON 数据
- 客户端支持防御 XSRF
官方仓库:https://github.com/axios/axios (opens new window)
# 安装方法
CDN
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
npm
npm install axios
Vue
中使用 axios
时可将 axios
注册到 Vue
原型上,这样可以方便的在所有 vue
实例中调用。
main.js
import axios from 'axios'
//挂载到vue原型上,其中$http可自定义名称
Vue.prototype.$http = axios;
vue组件中使用
this.$http.get('xxx')
# Get 请求
const axios = require('axios');
axios.get('/user?ID=12345')
.then(function (response) {
//成功
console.log(response);
})
.catch(function (error) {
//出错
console.log(error);
})
.finally(function () {
//总会执行
});
//上面的请求也可以这样写
axios.get('/user', {
params: {
ID: 12345
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
})
.finally(function () {
//总会执行
});
# Post 请求
axios.post('/user', {
firstName: 'xing',
lastName: 'gang'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
# 配置
axios({
url: '/user', //请求地址
method: 'get', //请求方法,默认get
baseURL: 'https://app.lttc.cn/api/', //url前缀,请求时此地址会被加到上面的url前面
headers: {'X-Requested-With': 'XMLHttpRequest'}, //请求头
//get参数
params: {
ID: 12345
},
//post数据
data: {
firstName: 'Fred'
},
timeout: 1000, //超时时间毫秒,默认0不超时
//更多配置参数请参考官网
});
# 默认配置
axios.defaults.baseURL = 'https://app.lttc.cn/api/';
axios.defaults.headers.common['UserKey'] = '123456';
axios.defaults.headers.post['Content-Type'] = 'application/json';