1

I have a service with Springboot that send a File (Excel) in base64 to Angular6. I can't send the File directly for polity of security, so, I first convert my file a base64...

In my Angular I can recived base64 :

 {
  "file" : "UEsDBBQACAAIAJOOOU/kSK2vGAEAADMDAAATAAAAW0NvbnRlbnRfVHlwZXNdLnht" 
 }  

The string file is more long...

However I when I try open this file, I get error in LibreOffice, "corrupt file"

this.data.getFile(endPoint).subscribe( 
          data => {          
                     const myfile= atob(data.file);
                     const blob = new Blob([myfile], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
                     saveAs(blob, 'myfile.xlsx'); 
                  } );

EDIT:

It's the value the "myfile" =>

enter image description here

Please, I need help..

Angular doesn't error when I do saveAs(blob, 'myfile.xlsx'); but if I try open the file I get error.

EduBw
  • 866
  • 5
  • 20
  • 40

2 Answers2

6

atob() outputs a UTF8 string, not a file. The base64 string you receive is most likely encode from an actual file which is an array of bytes. I think this function (from this answer) will work for you:

public base64ToBlob(b64Data, sliceSize=512) {
let byteCharacters = atob(b64Data); //data.file there
let byteArrays = [];
for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
    let slice = byteCharacters.slice(offset, offset + sliceSize);

    let byteNumbers = new Array(slice.length);
    for (var i = 0; i < slice.length; i++) {
        byteNumbers[i] = slice.charCodeAt(i);
    }
    let byteArray = new Uint8Array(byteNumbers);
    byteArrays.push(byteArray);
}
return new Blob(byteArrays, {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'});
}
Patrick
  • 334
  • 2
  • 7
0
public base64ToBlob(b64Data, sliceSize=512) {
let byteCharacters = atob(b64Data); //data.file there
let byteArrays = [];
for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
    let slice = byteCharacters.slice(offset, offset + sliceSize);

    let byteNumbers = new Array(slice.length);
    for (var i = 0; i < slice.length; i++) {
        byteNumbers[i] = slice.charCodeAt(i);
    }
    let byteArray = new Uint8Array(byteNumbers);
    byteArrays.push(byteArray);
}
return new Blob(byteArrays, {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'});
}