0

Error under Network in chrome

{ timeStamp: ......, status: 400
  error: 'Bad Request',
  message: 'Required request part 'file' is not present'
  path: 'url as hosted on Tomcat'
}

Spring Boot Controller.java file

@PostMapping("/Post")
public ResponseEntity<String> handleFileUpload(@RequestParam("file") 
MultipartFile file){ String Message=""; try .......(and so on)}

My Angular Component

<form [formGroup]="uploadForm" (ngSubmit) = "onSubmit()">
<input type="file" id="selectFile" formControlName="file1" name="selectFile"
(change)="fileEvent($event)"/>

<input type="submit" name="Submit"/>
</form>

Component.ts file

fileEvent(e) {
 this.data = e.target.files[0];
}
omSubmit() {
  let headers: any = new Headers();
  headers.append('Content-type', 'undefined');
  let formData = new FormData();
  formData.append("selectFile", this.data);
  const req5 = new HttpRequest('POST', 'url as hosted on TOMCAT', formData,
  reportProgress: true,
  responseType: 'text'
  });
  return this.httpClient.request(req5).subscribe(e => {(
  console.log(e);
  )}
}

Where am I making a mistake?

0

2 Answers 2

5

This:

formData.append("selectFile", this.data);

to that:

formData.append("file", this.data);

Cause

public ResponseEntity<String> handleFileUpload(@RequestParam("file") 
Sign up to request clarification or add additional context in comments.

7 Comments

I marking this as answer since it resolved my query :)
Thanks @Simon wanted to know reason behind this change so that i can upgrade my knowledge too
public ResponseEntity handleFileUpload(@RequestParam("file")) is expecting the file from the request to be accessible via request parameter "file" formData.append("file", this.formData) would do that for you
Hey, i thought your exception explains everything ;) With @RequestParam("file") you define that this method requires an input which is named "file". Here "formData.append("selectFile", this.formData);" you define that your formdata will be transferred named "selectFile". This just doesn't match. So your ex ception "'Required request part 'file' is not present" tells you, that the method expect a "file", which is not there cause it is named "selectFile". Have a nice day :)
thanks @Simon once again, please have a look to my below query once stackoverflow.com/questions/54463810/…
|
1

Param annotation in your controller looks for a field called file.

Change selectFile to file will solve the problem.

formData.append("file", this.data);

Parameter name matters in this, it has to be same in both Java & Angular

4 Comments

thanks @noiaverabale - replacing 'selectFile' to 'file' worked but changing Content-Type from undefined to 'multipart/form-data' produced Http - 417 error
My bad, I mistake content-type with enctype. I'll edit my response, thank you.
no problem any way thanks for help from your side too
Hi @noiaverabale - please have look to my query i guess its similar to what you commented earlier stackoverflow.com/questions/54463810/…

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.