Hi there,
There seems API 30 is blocking anyhow embedding local images with pdf-creator. I'm desperate since I've tried everything I could figue as solution.
The PDF file is properly created and it is correctly readable however images (any local content) are not displaying, although remote https images still work. It stopped working after upgrading from Android API 29 to API 30, and API 30 is now mandatory. Are you experiencing the same issue?
Everything I've tried displays the images in html using img [src]=“IMAGE”, but images are no longer displayed in the PDF file.
What I've tried:
-
Using base64 images:
IMAGE = this.sanitizer.bypassSecurityTrustUrl("data:image/jpeg;base64," + b64);
-
Using local image url:
let url = this.file.dataDirectory + img;
const win: any = window;
const fixedURL = win.Ionic.WebView.convertFileSrc(url);
IMAGE = this.sanitizer.bypassSecurityTrustResourceUrl(fixedURL);
or
IMAGE = IMAGE['changingThisBreaksApplicationSecurity’]
-
Using asset relative URL.
-
Using local path:
IMAGE = this.file.dataDirectory + img
I'd appreciate any help.
My code:
let htmlSample="<img style='width:150px' src=‘"+IMAGE+"' />";
let options = {
documentSize: 'A4',
type: 'base64'
}
this.pdfGenerator.fromData(htmlSample, options).
then((base64) => {
var fileName="generated";
this.saveBase64(base64, fileName)
.then(obj => {
if (obj) {
this.showPDF(obj);
}
}).catch(e => {
});
});
showPDF(file) {
let filePath = this.file.dataDirectory;
let namefile=file;
this.fileOpener.open(filePath+namefile, 'application/pdf');
}
saveBase64(base64:string, name:string):Promise<string>{
return new Promise((resolve, reject)=>{
let UUID = name+ (new Date().getTime()).toString(16);
let blob=this.b64toBlob(base64, 'application/pdf')
this.file.writeFile(this.file.dataDirectory, UUID + '.pdf', blob, {replace: true})
.then(fe => {
return resolve(
UUID + '.pdf'
);
}).catch(err => {
reject(err);
})
})
}
b64toBlob(b64Data, contentType) {
contentType = contentType || '';
var sliceSize = 512;
var byteCharacters = atob(b64Data);
var byteArrays = [];
for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
var slice = byteCharacters.slice(offset, offset + sliceSize);
var byteNumbers = new Array(slice.length);
for (var i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i);
}
var byteArray = new Uint8Array(byteNumbers);
byteArrays.push(byteArray);
}
var blob = new Blob(byteArrays, {type: contentType});
return blob;
}
Conditions:
"@ionic-native/pdf-generator": "^5.36.0”,
Latest cordova-pdf-generator plugin
"cordova-android": "^10.1.2”,
Angular 8
Ionic 5
Android API 30
Hi there,
There seems API 30 is blocking anyhow embedding local images with pdf-creator. I'm desperate since I've tried everything I could figue as solution.
The PDF file is properly created and it is correctly readable however images (any local content) are not displaying, although remote https images still work. It stopped working after upgrading from Android API 29 to API 30, and API 30 is now mandatory. Are you experiencing the same issue?
Everything I've tried displays the images in html using img [src]=“IMAGE”, but images are no longer displayed in the PDF file.
What I've tried:
Using base64 images:
IMAGE = this.sanitizer.bypassSecurityTrustUrl("data:image/jpeg;base64," + b64);Using local image url:
or
IMAGE = IMAGE['changingThisBreaksApplicationSecurity’]Using asset relative URL.
Using local path:
IMAGE = this.file.dataDirectory + imgI'd appreciate any help.
My code:
Conditions:
"@ionic-native/pdf-generator": "^5.36.0”,
Latest cordova-pdf-generator plugin
"cordova-android": "^10.1.2”,
Angular 8
Ionic 5
Android API 30