title: React upload a file to spring controller
body: <p>We have a Java spring-boot based server and a react JS UI app.
  And we need to implement a file upload from the react app to the server.</p>
  
  <p><strong>Server controller code:</strong></p>
  
  <pre><code>@RequestMapping(value = "/aaa/{id}/upload", method = RequestMethod.PUT, consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
  public Object uploadFile(@PathVariable("id") Integer id, @RequestParam("file") MultipartFile file, HttpServletRequest request) {
       ... 
      logic
      ...
  }
  </code></pre>
  
  <p>With postman, we can upload the file successfully. We can't do it via the react JS app.</p>
  
  <p><strong>This is react JS upload file code:</strong></p>
  
  <pre><code>uploadFile(file, type) {
          const formData = new FormData();
          formData.append('file', file);
  
          return axios.put(`aaa/1/upload`, file, {
              headers: {
                  'content-type': 'multipart/mixed; boundary=--ABC123Boundary'
              }
          })
              .then(() =&gt; {
                  NotificationsManager.info('File successfully uploaded.')
              })
              .catch((err) =&gt; {
                  NotificationsManager.error(err.message, `Error in uploading file`);
              });
      }
  </code></pre>
  
  <p>We tried with boundary, without boundary, with default boundary... nothing works.</p>
  
  <p><strong>UPDATE: We get this error:</strong></p>
  
  <pre><code>"Bad Request"
  exception:
  "org.springframework.web.multipart.support.MissingServletRequestPartException"
  message:"Required request part 'file' is not present"
  </code></pre>
  
  <p>What did we do wrong?</p>
  
  <p>Regards,
  Ido</p>