一、安装
代码语言:javascript复制cnpm install axios
二、使用
三种写法
代码语言:javascript复制// 第一种写法
axios.get('/query?name=tom').then(function (response) {
console.log(response);
}).catch(function (error) {
console.log(error);
});
// 第二种写法
axios.get('/query', {
params: {
name: 'tom'
}
}).then(function (response) {
console.log(response);
}).catch(function (error) {
console.log(error);
});
// 第三种写法
axios({
method: 'get',
url: '/query',
data: {
name: 'tom',
}
}).then(function (response) {
console.log(response);
}).catch(function (error) {
console.log(error);
});
POST请求
代码语言:javascript复制axios.post('/query', {
name: 'tom',
icon: 'img_path'
}).then(function (response) {
console.log(response);
}).catch(function (error) {
console.log(error);
});
并发请求
代码语言:javascript复制function getUserAccount() {
return axios.get('/query?name=tom');
}
function getUserPermissions() {
return axios.get(/role?name=tom');
}
axios.all([getUserAccount(), getUserPermissions()])
.then(response) {
console.log(response);
// 两个请求都执行完成后返回,所有的请求结果都在这个res的对象下面
}));
三、参数配置
代码语言:javascript复制axios({
// 请求的服务器 URL
url: '/user',
// 创建请求时使用的方法
method: 'get', // 默认是 get
// 将自动加在 url 前
baseURL: 'https://some-domain.com/api/',
// 在向服务器发送前,修改请求数据
// 只能用在 'PUT', 'POST' 和 'PATCH' 这几个请求方法
// 后面数组中的函数必须返回一个字符串,或 ArrayBuffer,或 Stream
transformRequest: [function (data) {
// 对 data 进行任意转换处理
return data;
}],
// 在传递给 then/catch 前,修改响应数据
transformResponse: [function (data) {
// 对 data 进行任意转换处理
return data;
}],
// 自定义请求头
headers: {'X-Requested-With': 'XMLHttpRequest'},
// 与请求一起发送的 URL 参数
params: {
ID: 12345
},
// 用于 params 的序列化的函数
paramsSerializer: function(params) {
return Qs.stringify(params, {arrayFormat: 'brackets'})
},
// 请求发送的数据,适用于 PUT, POST, 和 PATCH
// 在没有设置 transformRequest 时,必须是以下类型之一:
// string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
// 浏览器专属:FormData, File, Blob
// Node 专属: Stream
data: {
firstName: 'Fred'
},
// 指定请求超时毫秒数(0 表示无超时时间)
timeout: 1000,
// 表示跨域请求时是否需要使用凭证,默认 false
withCredentials: false,
// 允许自定义处理请求,常用用于测试
adapter: function (config) {
/* ... */
},
// 表示应该使用 HTTP 基础验证,并提供凭据,该参数会在 headers 设置 Authorization
auth: {
username: 'janedoe',
password: 's00pers3cret'
},
// 表示服务器响应的数据类型,
// 支持类型:arraybuffer, blob, document, json(默认), text, stream
responseType: 'json',
// 用作 xsrf token 的值的cookie的名称
xsrfCookieName: 'XSRF-TOKEN',
// xsrf token 值的 HTTP 头的名称
xsrfHeaderName: 'X-XSRF-TOKEN',
// 上传处理进度事件
onUploadProgress: function (progressEvent) {
},
// 下载处理进度事件
onDownloadProgress: function (progressEvent) {
},
// 响应内容的最大尺寸
maxContentLength: 2000,
// 定义对于给定的HTTP 响应状态码。
validateStatus: function (status) {
return status >= 200 && status < 300;
},
// 定义在 node.js 中 follow 的最大重定向数目,为0将不会 follow 任何重定向
maxRedirects: 5,
// 在 node.js 中用于定义在执行 http 和 https 时使用的自定义代理
httpAgent: new http.Agent({ keepAlive: true }),
httpsAgent: new https.Agent({ keepAlive: true }),
// 'proxy' 定义代理服务器的主机名称和端口
// `auth` 表示 HTTP 基础验证应当用于连接代理,并提供凭据
proxy: {
host: '127.0.0.1',
port: 9000,
auth: : {
username: 'mikeymike',
password: 'rapunz3l'
}
}
}).then(function (response) {
console.log(response);
}).catch(function (error) {
console.log(error);
});