webblover
webblover

Reputation: 1216

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

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.

enter image description here

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.

Edit: After setting fileNamArr[0] as third parameter in .append API, the filename="blob" has been converted to filename="home" which is my excel sheet filename. So, you may ignore that part in image above.

Upvotes: 1

Views: 37

Answers (0)

Related Questions