简单讲些axios的简单应用,具体使用可以参考axios中文文档https://www.kancloud.cn/yunye/axios/234845
const Axios = require('axios')
1.这是文档指出的axios的支持的调用方法:
axios.request(config)
axios.post(url[, data[, config]])
axios.put(url[, data[, config]])
axios.patch(url[, data[, config]])
并发
处理并发请求的助手函数
创建实例
可以使用自定义配置新建一个 axios 实例
var instance = axios.create({
baseURL: 'https://some-domain.com/api/',
timeout: 1000,
headers: {'X-Custom-Header': 'foobar'}
});
实例的方法和axios的方法一模一样,如上面调用就是使用instance.get这种
2.参数问题
1>.举例Axios.get(url[, config])
解释:这里表示第一个参数是请求的url,第二个参数可选,为一个配置对象,这个config对象在axios文档中有具体列举,对应设置就行
例子:我使用node的express框架抓取qq音乐的get接口
var express = require('express')
var app = express()
var Axios = require('axios')
Axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'
app.get('/', function (req, res) {
res.header("Access-Control-Allow-Origin", "http://127.0.0.1:5500") // 这里是因为本地起的服务是5500,而服务运行在3000,设置这个来解决跨域问题
const url = 'https://c.y.qq.com/v8/fcg-bin/fcg_v8_album_info_cp.fcg?ct=24&albummid=004K3LHV3ht6pl&g_tk=13876210&loginUin=944870787&hostUin=0&format=json&inCharset=utf8&outCharset=utf-8¬ice=0&platform=yqq.json&needNewCode=0'
Axios.get(url, {
headers: { // 这个不设置浏览器会报跨域错误
referer: 'https://u.y.qq.com', //设置请求的来源
host: 'u.y.qq.com'
}
}).then((response) => {
res.json(response.data);
}).catch((e) => {
console.log(e);
})
})
app.listen(3000)
2>.Axios.post(url[, data[, config]])
解释:第一个参数是请求url(必填),第二个参数是请求参数(可选),第三个参数是配置对象config(可选)
例子:我使用node的express框架抓取qq音乐的post接口(跟上面例子一样的地方省略了)
Axios.post('https://u.y.qq.com/cgi-bin/musicu.fcg?g_tk=5381',{
"comm":{
"uin":"0","ct":"24","cv":"0","gzip":"0","mcc":"460","mnc":"1"
},
"data_id":{
"module":"track_info.UniformRuleCtrlServer",
"method":"GetTrackInfo",
"param":{
"ids":[232263711],
"types":[0]
}
}
},
{
headers: {
referer: 'https://u.y.qq.com',
host: 'u.y.qq.com'
}
}
).then(response => {
res.json(response.data);
}).catch(err => {
console.log(err)
})
3>.Axios.request(config)最后这种写法
Axios({
method: 'post',
url: 'https://u.y.qq.com/cgi-bin/musicu.fcg?g_tk=5381',
data: {
"comm":{
"uin":"0","ct":"24","cv":"0","gzip":"0","mcc":"460","mnc":"1"
},
"data_id":
{
"module":"track_info.UniformRuleCtrlServer",
"method":"GetTrackInfo","param":{"ids":[232263711],"types":[0]}
}
},
headers: {
referer: 'https://u.y.qq.com',
host: 'u.y.qq.com'
}
}).then(response => {
res.json(response.data);
}).catch(err => {
console.log(err)
})
根据实际情况选择适合的方式就好
axios还有默认配置:
全局的 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
拦截器
在请求或响应被 then
或 catch
处理前拦截它们。
// 添加请求拦截器
axios.interceptors.request.use(function (config) {
// 在发送请求之前做些什么
return config;
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error);
});
// 添加响应拦截器
axios.interceptors.response.use(function (response) {
// 对响应数据做点什么
return response;
}, function (error) {
// 对响应错误做点什么
return Promise.reject(error);
});
以上就是基本就是我所用到的一些axios的用法