title: Multer + React + Nodejs Axios request
body: <p><strong>Axios Post request</strong> </p>
  
  <pre><code>// Create profile
  export const createProfile = (profileData, avatar, history) =&gt; dispatch =&gt; {
    dispatch(clearErrors());
    const image = new FormData();
    image.append("avatar", avatar, avatar.name);
    axios
      .post("/api/profile", image, profileData)
      .then(res =&gt; history.push("/dashboard"))
      .catch(err =&gt;
        dispatch({
          type: GET_ERRORS,
          payload: err.response.data
        })
      );
  };
  </code></pre>
  
  <blockquote>
    <p>Edit ---> Axios post request second attempt</p>
  </blockquote>
  
  <pre><code>// Create profile
  export const createProfile = (profileData, avatar, history) =&gt; dispatch =&gt; {
    dispatch(clearErrors());
    const image = new FormData();
    image.append("avatar", avatar, avatar.name);
    image.append("user", profileData, profileData.username);
    axios
      .post("/api/profile", image)
      .then(res =&gt; history.push("/dashboard"))
      .catch(err =&gt;
        dispatch({
          type: GET_ERRORS,
          payload: err.response.data
        })
      );
  };
  </code></pre>
  
  <p><code>profileData</code> is what i want in the <code>req.body</code> and avatar is what i receive in <code>req.file</code> in my back-end with multer, but what i receive is the <code>req.file</code> with the image but nothing in my <code>req.body</code>(Just an empty object)</p>
  
  <p><strong>This is my router in node</strong></p>
  
  <pre><code>router.post(
    "/",
    upload.single("avatar"),
    passport.authenticate("jwt", { session: false }),
    (req, res) =&gt; {
      console.log(req.body);
        }
      );
  </code></pre>