在Axios中发出多个发布请求，然后获取所有响应以发出另一个请求 [英] Make Multiple Post Requests In Axios then get all the response to make another request

问题描述

我已经发出了2个请求..，但我想使用每个响应中的ID发出补丁请求...

i have already make 2 request.., but i want to make a patch request using the id from each response...

另一个将被放置在第一个中，第二个将被放置在数据中

the other one will be put in the first one and the second one will be in the data

我们可以将其传递给var吗? idk该怎么做..

can we maybe pass it to the var ? idk how to do that..

我使用gatsbyjs和DirectusCMS作为参考

for reference i use gatsbyjs and i use directusCMS

let url3 = `${process.env.GATSBY_DIRECTUS_API_URL}/gemaclc/items/pendaftar/:id (the id should be from the first response that we just made)?access_token=${process.env.GATSBY_DIRECTUS_TOKEN}`;

axios.patch(url3, data, {
    
    data: JSON.stringify(
    {
        featured_image: 1 (id of the second response whcih is an image),
        
    
    }), 
})

event.preventDefault();

const data = new FormData() 
data.append('file', this.state.selectedFile)
console.warn(this.state.selectedFile);
console.log(data);

// console.log("User Email :"  + this.state.email)
// console.log("User nama :"  + this.state.name)
// console.log("User telepon :"  + this.state.telepon)
// console.log("User program :"  + JSON.stringify([this.state.program]))
// console.log("User tanggal :"  + this.state.tanggal_lahir)
// console.log("User tempat :"  + this.state.tempat_lahir)

let url = `${process.env.GATSBY_DIRECTUS_API_URL}/gemaclc/items/pendaftar?access_token=${process.env.GATSBY_DIRECTUS_TOKEN}`;

let url2 = `${process.env.GATSBY_DIRECTUS_API_URL}/gemaclc/files?access_token=${process.env.GATSBY_DIRECTUS_TOKEN}`;


let url2 = `${process.env.GATSBY_DIRECTUS_API_URL}/gemaclc/files?access_token=${process.env.GATSBY_DIRECTUS_TOKEN}`;

axios(url, {
    method: 'POST',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json',
    },
    data: JSON.stringify({
      status:"published",
      nama: this.state.name,
      // email: this.state.email,
      // telepon: this.state.telepon,
      // program: [1],
      // tanggal_lahir: this.state.tanggal_lahir,
      // tempat_lahir: this.state.tempat_lahir,
    })
})
.then(res => {
  console.log(res)
  return axios.post(url2, data, {
    
    data: JSON.stringify(
    {
        data: data,
        
    
    }), 
})
})
.then(res => {
  console.log(res.data.data.id) 
  return axios.patch( url3, {

  })
})
.catch(error => {
    console.log(error)
});

推荐答案

我制作了一个非常简单的示例，说明了您尝试使用async/await语法完成的工作，因为.then()读起来会比较混乱；基本上，您可以将每个发布请求的结果存储在变量中，以便在补丁请求中使用.我不确定您的响应对象是什么样的，因此您可能必须进行一些其他属性提取.

I made a very simplified example of what you're trying to accomplish using async/await syntax since .then() would be messier to read; basically you can store the result of each post request in a variable to use in your patch request. I'm not sure what your response object looks like, so you may have to do some additional property extraction.

//simulates 1st post request
const post1= new Promise((resolve, reject) => {
    setTimeout(() => resolve(1), 1000)
});

//simulates 2nd post request
const post2= new Promise((resolve, reject) => {
    setTimeout(() => resolve(2), 1000)
});

const groupedRequests = async() => {

    //represents calling your 1st post request;
    let id1 = await post1; 
    //represents calling your 2nd post request
    let id2 = await post2; 
  
    //represents your patch request
    console.log(id1, id2)
}
  
groupedRequests();

我继续进行.then()版本，以便您可以看到比较结果.

I went ahead and did the .then() version so you could see the comparison.

//simulates 1st post request
const post1= new Promise((resolve, reject) => {
    setTimeout(() => resolve(1), 1000)
});

//simulates 2nd post request
const post2= new Promise((resolve, reject) => {
    setTimeout(() => resolve(2), 1000)
});

//stores first result
let id1; 

//represents callings 1st post request
post1
.then(result => {
    id1 = result;
    //represents calling 2nd post request
    return post2;
}).then(result => {
    let id2 = result; 
    //represents your patch request
    console.log(id1, id2)
})

这篇关于在Axios中发出多个发布请求，然后获取所有响应以发出另一个请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！