Dropzone.js file upload to spring boot along with payload returns 415 error

Viewed 209

I am using dropzone.js in the Ember application for File upload. Using spring-boot 2.0 as backend server. File upload is not working when trying to integrate with the spring boot. Please find the below code for reference,

Spring controller

@PostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
public ResponseEntity<List<ImageResponseData>> uploadImage(
    @RequestPart("file") MultipartFile multipartFile,
    @RequestHeader(value = "pathVariable", required = false) String pathVariable,
    @RequestPart(value = "metadatas",required = false) List<Map<String,String>> metadatas) throws ServiceException {

    // process file and json to upload

    }

JS information

 didInsertElement() {
const url = this.get('url'),
  target = this.$(`.${this.get('targetClass')}`).get(0),
  self = this,
  get = Ember.get;

this.set('register-as', this);
var dz = new Dropzone(target, {
  url: url,
  maxFiles: 1,
  headers:{"pathVariable": self.pathVariable},
  addRemoveLinks: true,
  autoProcessQueue: false,

  init() {
    var file = self.get('images') || [];
      this.options.addedfile.call(this, file);
          let callback = null; // Optional callback when it's done
          let crossOrigin = "Anonymous";
          this.createThumbnailFromUrl(file, file.url, callback, crossOrigin);
          this.emit("success". file);
          this.emit("complete", file);
          this.files.push(file);
  }
});
dz.on("sending", function(file, xhr, formData) {
  if (self.datas.length != 0) {
    formData.append("metadatas", JSON.stringify(self.datas));
  }
});
dz.on('success', (file, response) => {
        console.log("file upload success:: ",file.id);
});

dz.on('error', (file, errorMessage, xhr) => {
        console.log("file upload failed",errorMessage);
});

dz.on('removedfile', (file) => {
  console.log('removedFile', file);
});

this.set('dropzone', dz);

},

This is how data's are getting submitted from browser,

enter image description here

But if I try to upload the data to the spring boot application from postman it works.

Find below image for reference of upload data via postman

enter image description here

Whereas if I try to upload it via JS it throws 415. Any help would be really appreciable.

0 Answers
Related