I am new to Angular 2 and I am trying to upload an Excel from Angular 2 frontend.
I want to upload the Excel from Angular 2 frontend, pass it to Spring Boot in backend, inside Spring Boot I will make necessary changes. Finally pass it back to angular to render it on screen.
My Approach:
let user select the Excel from frontend
POST it to Spring Boot backend, make necessary modification using Apache POI
Finally pass it to angular again to render it on screen.
Problem Area :-
I have made the frontend part to receive input
below is my code :-
<input type="file" id="myfile" class="form-control" [(ngModel)]="fileObj" (change)="upload($event)" accept=".xlsx">
Angular Component method to called on change of element :-
file: File
upload(event : EventTarget){
let eventObj : MSInputMethodContext = <MSInputMethodContext> event ;
let target : HTMLInputElement = <HTMLInputELement> eventObj.target ;
let files : FileList = target.files ;
this.file = files[0];
this._appService.sendFile(this.file);
}
above functions calls the sendFile method in appservice of Angular 2
below is the code for appService :-
private headers = new Headers({'Content-Type' : 'multipart/form-data'});
sendFile(fileObj : File){
return this.http.post('http://localhost:9000/submitexcel', fileObj, {headers : this.headers}).map(res => res.json().data).subscribe();
}
Spring Boot Controller to receive the incoming file.
@RestController
public class ExcelUploadController {
@RequestMapping(method = RequestMethod.POST , value="/submitexcel")
public ResponseEntity<String> getFile(@RequestParam("File") MultipartFile file){
System.out.println("inside controller");
}
}
whenever I make a call to controller, I get error on console :-
"the request was rejected because no multipart boundary was found "
Now below are my problem questions :-
Am I not sending the Excel file properly to Spring Boot?
If not please let me know the correct way to do it.Is my approach correct to achieve what is required?
How will I send the Excel back from Spring Boot to angular to display on Frontend?
I tried googling a lot about this, but could not find anything useful
Please help me, I am stuck since many days.