Promise.all([
new Promise((rs,rj)=> {
setTimeout(() => {
rs('p2')
}, 5000)
})
, new Promise((rs,rj)=> {
setTimeout(() => {
rs('p1')
}, 2000)
})
]).then((result) => {
console.log(result)
})
---- fetch方式实现
Promise.all([
new Promise((rs, rj) => {
fetch('https://api04.aliyun.venuscn.com/mobile?mobile=17628873245',
{
headers: {
'Authorization': 'APPCODE 08d79d4b101e42cfb2c271c1871ebd21'
}
})
.then(function (response) {
rs([null, response])
})
.catch(function (err) {
console.log(err);
rs([err, null])
});
})
, new Promise((rs, rj) => {
fetch('https://qyexpress.market.alicloudapi.com/composite/queryexpress?number=YT6085046461082',
{
headers: {
'Authorization': 'APPCODE 08d79d4b101e42cfb2c271c1871ebd21'
}
})
.then(function (response) {
// rs(response.json())
rs([null, response])
})
.catch(function (err) {
// console.log(err);
rs([err, null])
});
})
]).then((result) => {
console.log('多个接口的数据', result)
})
—vue和react中(axios方式)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script>
console.log(axios)
// config.js
// export const baseURL = 'http://api.suotuobao.com/api/' // 线上接口
// export const timeout = 30000
const baseURL = 'http://api.suotuobao.com/api/'
const timeout = 30000
// http.js
// import { baseURL, timeout, applicationKey } from './config'
axios.defaults.timeout = timeout
axios.defaults.baseURL = baseURL
// api.js
function getMobileInfo() {
return new Promise((rs, rj) => {
axios({
headers: {
'Authorization': 'APPCODE 08d79d4b101e42cfb2c271c1871ebd21'
},
url: 'https://api04.aliyun.venuscn.com/mobile?mobile=17628873245',
}).then(res => {
rs([null, res.data])
}).catch(err => {
})
})
}
function getExpressInfo() {
return new Promise((rs, rj) => {
axios({
headers: {
'Authorization': 'APPCODE 08d79d4b101e42cfb2c271c1871ebd21'
},
url: 'https://qyexpress.market.alicloudapi.com/composite/queryexpress?number=YT6085046461082',
}).then(res => {
rs([null, res.data])
}).catch(err => {
})
})
}
$util = {
getMobileInfo,
getExpressInfo
}
// main.js入口引入
// main.js
axios.all([$util.getMobileInfo(), $util.getExpressInfo()]).then(axios.spread(function (allSearchTopic, allSearchs) {
console.log(allSearchTopic, '|||', allSearchs)
// debugger//打印可以拿到所有的返回值
// allSearchTopic == 方法一的返回值
// allSearchs == 方法二的返回值
}))
</script>
</body>
</html>