如何在 axios 的 .then() 链中访问之前的承诺响应？

Question

我需要访问 responseA 才能访问链式请求中的字段值。怎样才能优雅地做到这一点？

  axios.get(`/endpoint`) 
            .then((responseA) => {
               // Do something with responseA
               return axios.put(signedUrl, file, options); 
            })
            .then((responseB) => {
               // Do something with responseA & responseB
            })
            .catch((err) => {
                console.log(err.message);
            });

更新：我应该在我的第一个 .then() 中提到 return 另一个网络请求。而且它必须按顺序发生。

Answer 1

第一个 .then() 块内发生了什么？从理论上讲，您可以 return 从 responseA 到第二个 .then() 块的所需值，因为第一个 then 块中的任何 return 都可以用作 responseB。换句话说，它看起来像这样：

axios.get(`/endpoint`) 
        .then((responseA) => {
           // additional request/logic
           const moreData = someFunction()
           return { responseAdata: responseA.dataYouWant, moreData: moreData }
        })
        .then((responseB) => {
           // now responseA values will be available here as well, e.g.
           responseB.responseAdata
           // Do something with responseA & responseB
        })
        .catch((err) => {
            console.log(err.message);
        });

Answer 2

您有多种选择。

1) 打破链条

let promiseA = axios.get(`/endpoint`) 
let promiseB = promiseA.then((responseA) => {
               // Do something with responseA
            })

return Promise.all([promiseA, promiseB]).then(function([responseA, responseB]) {
        // Do what you must
});

2) 使用 await

let responseA = await axios.get('/endpoint/')
// You can figure out the rest

Answer 3

您可以使用 Promise.all:

axios.get(`/endpoint`) 
.then(
  responseA =>
    Promise.all([
      responseA,
      axios.get("/endpointB")
    ])   
)
.then(
  ([responseA,responseB]) => {
  console.log(responseA,responseB);
})
.catch((err) => {
    console.log(err.message);
});

Answer 4

如果还有人遇到问题，请尝试以下操作：

  axios.get('https://api.openweathermap.org/geo/1.0/direct?q=' + req.body.city + '&limit=1&appid=e43ace140d2d7bd6108f3458e8f5c')
        .then(
            (response1) => {
                let output = response1.data;
                axios.get('https://api.openweathermap.org/data/2.5/weather?lat=' + output[0].lat + '&lon=' + output[0].lon + '&appid=e43ace1d1640d2d7bd61058e8f5c')
                    .then((weatherdd) => {
                        res.render('index.twig', { weatherdata: weatherdd.data, cityname: req.body.city, todaydatex: todayDate });
                    })
            }
        )
        .catch(
            err => {
                res.send(err)
            }
        );

提示：如您所见，我正在使用从第一个请求返回的 response1，然后定义一个带有输出的局部变量，最后在我的下一个 HTTP 请求中使用数据（例如：output[0].lat）

如何在 axios 的 .then() 链中访问之前的承诺响应？

How do I access previous promise response in a .then() chain in axios?

javascript

amazon-s3

axios