GCP excel file uploaded with normal Form upload Multipart-data gets corrupted on download-...

I have the following code to upload the excel file to GCP storage. I'm trying to upload as blob multipart file. It's getting uploaded to storage correctly but on downloading and opening, it says file extension or file format invalid. I have the sample upload request payload that shows this clearly.



Please look at this request payload metadata and if you see any discrepancy that causes file corruption for media file types?

And here is the Javascript/Angular code that does it exactly as expected,

private uploadExcelGCP(signedUrl: string, file: File) {
const formData = new FormData();
var fileNamTemp = file.name;
var fileNamArr = fileNamTemp.split('.');

// formData.append('file', file);
// formData.append('file', new Blob([file]));
formData.append('file', new Blob([file], {type: file.type}), fileNamArr[0]);

const headers = new HttpHeaders({
// 'Content-Type': file.type
// 'Content-Type': 'multipart/form-data'
'Content-Type': 'application/octet-stream'
});

return this.http
.put(signedUrl, formData, {
headers,
observe: 'response',
reportProgress: true
})
.pipe(
map(() => console.log('Success')),
catchError((error) =>
of(console.log('failure'))
)
)
.toPromise();
}


I'm suspecting following two lines,

formData.append('file', new Blob([file], {type: file.type}), fileNamArr[0]);


and,

const headers = new HttpHeaders({
// 'Content-Type': file.type
// 'Content-Type': 'multipart/form-data'
'Content-Type': 'application/octet-stream'
});


because, the uploaded file works normally for pdf, csv, eml file formats. It only fails for .xlsx or .png since these are media formats. Any help is greatly appreciated. I'll fine-tune and update here if you got some ideas.

Continue reading...