Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 Node.js 中。
在使用 Axios 发送请求时,可以通过传递一个配置对象来指定请求的各种选项。
以下是一些常用的 Axios 配置选项及其说明:
1.url: (必需)请求的 URL。
javascript
url:'/user'
2.method: (可选,默认为GET)请求方法。
javascript
method:'POST'
3.baseURL: (可选)请求的基础 URL。如果指定了baseURL,则url 将相对于这个基础 URL。
javascript
baseURL:'https://api.example.com'
4.headers: (可选)请求头对象。
javascript
headers:{
'Content-Type':'application/json',
'Authorization':'Bearer your-token'
}
5.params: (可选)URL 参数对象。
javascript
params:{
ID:12345
}
6.data: (可选)请求体数据,用于POST、PUT、PATCH 等方法。
javascript
data:{
firstName:'John',
lastName:'Doe'
}
7.timeout: (可选)请求超时时间(毫秒)。
javascript
timeout:5000
8.withCredentials: (可选,默认为false)是否允许跨域请求携带凭证(如 cookies)。
javascript
withCredentials:true
9.responseType: (可选,默认为'json')响应的数据类型,可以是'arraybuffer'、'blob'、'document'、'json'、'text'、'stream'。
javascript
responseType:'json'
10.onUploadProgress: (可选)上传进度事件的回调函数。
javascript
onUploadProgress:function(progressEvent){
console.log(Math.round((progressEvent.loaded*100)/ progressEvent.total));
}
11.onDownloadProgress: (可选)下载进度事件的回调函数。
javascript
onDownloadProgress:function(progressEvent){
console.log(Math.round((progressEvent.loaded*100)/ progressEvent.total));
}
12.maxContentLength: (可选)允许的最大响应内容长度(字节)。
javascript
maxContentLength:2000
13.maxBodyLength: (可选)允许的最大请求体长度(字节)。
javascript
maxBodyLength:2000
14.validateStatus: (可选)用于验证服务器响应状态码的函数。默认情况下,Axios 会将 2xx 范围内的状态码视为成功。
javascript
validateStatus:function(status){
return status>=200&& status<300;// 默认行为
}
15.auth: (可选)HTTP 基本认证信息。
javascript
auth:{
username:'janedoe',
password:'s3cr3t'
}
16.proxy: (可选)代理服务器配置。
javascript
proxy:{
host:'127.0.0.1',
port:9000,
auth:{// 可选
username:'mikeymike',
password:'rapunz3l'
}
}
以下是一个综合示例,展示了如何使用这些配置选项:
javascript
importaxiosfrom'axios';
axios({
url:'/user',
method:'POST',
baseURL:'https://api.example.com',
headers:{
'Content-Type':'application/json',
'Authorization':'Bearer your-token'
},
params:{
ID:12345
},
data:{
firstName:'John',
lastName:'Doe'
},
timeout:5000,
withCredentials:true,
responseType:'json',
onUploadProgress:function(progressEvent){
console.log(Math.round((progressEvent.loaded*100)/ progressEvent.total));
},
onDownloadProgress:function(progressEvent){
console.log(Math.round((progressEvent.loaded*100)/ progressEvent.total));
},
validateStatus:function(status){
return status>=200&& status<300;// 默认行为
},
auth:{
username:'janedoe',
password:'s3cr3t'
},
proxy:{
host:'127.0.0.1',
port:9000
}
}).then(response=>{
console.log('Response:', response.data);
}).catch(error=>{
console.error('Error:', error);
});
通过这些配置选项,你可以灵活地控制 Axios 发送的请求,满足各种不同的需求。