Export excel not wokring For base64

[Ansuman Panda]

Hello Synfusion Team,

We are trying to export images to excel after converting it into base64 but still we are not getting image in the excel

ts.file

async exportQueryCellInfo(args: ExcelQueryCellInfoEventArgs){

if (args.column.type == 'image') {

if ((args as any).name === 'excelQueryCellInfo') {

/*OUR custom method to get Base64*/

const imageName =(args as any).value?.split('/');

const imageType =imageName[imageName.length-1].split('.')

console.log(imageName[imageName.length-1],imageType[1])

const imageInBase64= await this.azureImageService.getImage(imageName[imageName.length-1],imageType[1]);

/*custom method ends

args.image = { height: 75, base64: imageInBase64, width: 75 };

console.log(args);

}

}

}

{

"data": {

**************************************************

"cost": 12,

"retail": 56,

"image": "https://***********.blob.core.windows.net/mY-images/organisation-1/645.png",

*************************************************

},

"column": {

*********************************************************

"type": "image",

"minWidth": 200,

******************************************************

},

"value": "https://*********.blob.core.windows.net/mY-images/organisation-1/645.png",

"colSpan": 1,

"cell": {

"index": 11,

"value": "https://********.blob.core.windows.net/mY-images/organisation-1/645.png",

"style": {

"name": "styleDefinitionGridcolumn11"

}

},

"name": "excelQueryCellInfo",

"image": {

"height": 75,

"base64": "data:image/png;base64,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",

"width": 75

}

}

It is throwing below error

[Rajapandi Ravi]

Hi Ansuman, 

Greetings from Syncfusion support 

Based on your query, we would like to inform you that by default in EJ2 Grid, image exporting is implemented based on base 64-bit string. If we want to export images to Excel or PDF, we have to use base64 string for required image for args.image parameter in pdfQueryCellInfo or excelQueryCellInfo. So, if you are using required images as URL in database, you have to convert this image URL to base64 string at your end then only it will work. This is demonstrated in the below sample demo example. 

Sample Demo: https://ej2.syncfusion.com/angular/demos/#/material/grid/default-exporting 

Before we start providing solution on your query, we need some information for our clarification. Please share the below details that will be helpful for us to provide better solution. 

1)           Please share the details about why you are using async await in exportQueryCell info event. 

2)           Please share your exact requirement with detailed description. 

Regards, 

Rajapandi R 

[Ansuman Panda]

Thank you for sharing the demo.

Remove the  "data:image/png;" from the base64 it will work

[Rajapandi Ravi]

Hi Ansuman, 

We are happy to hear that the provided solution works fine at our end. 

Please get back to us if you need further assistance. 

Regards, 

Rajapandi R