VUE中使用HTTP库Axios方法详解

2020-06-16 06:44:21易采站长站整理

httpAgent: new http.Agent({ keepAlive: true }),
httpsAgent: new https.Agent({ keepAlive: true }),
// 'proxy' 定义代理服务器的主机名称和端口,`auth` 表示 HTTP 基础验证应当用于连接代理,并提供凭据。这将会设置一个 `Proxy-Authorization` 头,覆写掉已有的通过使用 `header` 设置的自定义 `Proxy-Authorization` 头。
proxy: {
host: '127.0.0.1',
port: 9000,
auth: : {
username: 'mikeymike',
password: 'rapunz3l'
}
},
// `cancelToken` 指定用于取消请求的 cancel token
cancelToken: new CancelToken(function (cancel) {
})
}

下面是一个实例


let HTTP = axios.create({
baseURL: 'http://localhost/',
timeout:1000,
headers:{
'author':'xiaohuochai'
}
})
HTTP.post('index.php',{
id:12345,
text:'jb51'
}).then((response)=>{
console.log(response)
}).catch((error)=>{
console.log(error)
})

结果如下

响应结构

某个请求的响应包含以下信息


{
// `data` 由服务器提供的响应
data: {},
// `status` 来自服务器响应的 HTTP 状态码
status: 200,
// `statusText` 来自服务器响应的 HTTP 状态信息
statusText: 'OK',
// `headers` 服务器响应的头
headers: {},
// `config` 是为请求提供的配置信息
config: {}
}

使用 then 时,将接收下面这样的响应:


.then(function(response) {
console.log(response.data);
console.log(response.status);
console.log(response.statusText);
console.log(response.headers);
console.log(response.config);
});

配置默认值

可以指定将被用在各个请求的配置默认值

全局的axios默认值


axios.defaults.baseURL = 'https://api.example.com';
axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

自定义实例默认值


// 创建实例时设置配置的默认值
var instance = axios.create({
baseURL: 'https://www.jb51.com'
});
// 在实例已创建后修改默认值
instance.defaults.headers.common['Authorization'] = AUTH_TOKEN;

配置优先顺序

配置会以一个优先顺序进行合并。这个顺序是:在 lib/defaults.js 找到的库的默认值,然后是实例的 defaults 属性,最后是请求的 config 参数。后者将优先于前者


// 使用由库提供的配置的默认值来创建实例