title: Is there an easier way to make these axios post reqest?
body: <p>I'm trying to upload multiple images to cloudinary via api in my react app using axios.
  I'm new to promises, so I'm not sure if I'm using the right approach here.</p>
  
  <p>I am able to upload all the images to cloudinary; however, the response I get is the confusing part, as with the response I need to pass the images' urls to an object, so I can send them to an email using mailgun. </p>
  
  <p>Here is my code to upload the images: </p>
  
  <pre><code>if(payment === "success") {
  axios
      .all([
          props.imgForProduct.map((img) =&gt; {
              const fd = new FormData();
              fd.append("file", img);
              fd.append("upload_preset", "sublimation");
              return axios
                  .post(
                      "https://api.cloudinary.com/v1_1/ahkji7ation/image/upload",
                      fd
                  )
                  .then(async (res) =&gt; {
                      return (imgUrl = res.data.secure_url);
                  })
                  .catch((err) =&gt; console.log(err));
          }),
  
          props.screenshot.map((img) =&gt; {
              const fd = new FormData();
              fd.append("file", img);
              fd.append("upload_preset", "sublimation");
              return axios
                  .post(
                      "https://api.cloudinary.com/v1_1/ahkji7ation/image/upload",
                      fd
                  )
                  .then(async (res) =&gt; {
                      return (imgScrSht = res.data.secure_url);
                  })
                  .catch((err) =&gt; console.log(err));
          }),
      ])
      .then(
          axios.spread(async (...res) =&gt; {
              imgUrl.push(res[0][0]);
              imgScrSht.push(res[1][0]);
  
              let dataObj = {
                  email: props.email,
                  img: imgUrl,
                  screenshot: imgScrSht,
              };
              console.log(dataObj);
  
              new Promise((resolve, reject) =&gt; {
                  axios.post("/email_to_ayp_sublimation", dataObj);
                  resolve((res) =&gt; {
                      console.log(res);
                  });
                  reject((err) =&gt; {
                      console.log(err);
                  });
              });
          })
      )
      .catch((err) =&gt; console.error(err));    
  }
  </code></pre>
  
  <p>When I console log the dataObj this is what I'm sending in the last call (the new Promise):</p>
  
  <pre><code>screenshot: Array(1)
  0: Promise {&lt;resolved&gt;: "https://res.cloudinary.com/ahkji7ation/image/u… 
  590871936/ahkji7ation/kqebmkjfj0prmyygls2y.jpg"}
  length: 1
  __proto__: Array(0)
  </code></pre>
  
  <p>I'm receiving [object Object] in the backend, instead of the url I need. Can anybody help me sort this out? 
  Thanks in advance</p>