unsafe:data:image/jpeg;base64, net::ERR_UNKNOWN_URL_SCHEME in Angular 7

You need to make this change

this.ImgUrl = 'data:image/png;base64,' + this.inspectionDetails.reportImage;

or

this.ImgUrl = `data:image/png;base64,${{this.inspectionDetails.reportImage}}`;

then Your HTML will be

<img [src]="ImgUrl " width="100%" height="100%" alt="Image" />

this should work

EDIT:

public ImgUrl = ' ';

Use _sanitizer.bypassSecurityTrustUrl to tell angular src value is safe

You can change your code like below.

Import DomSanitizer

import { DomSanitizer } from '@angular/platform-browser';

Inject this dependency into the constructor

constructor(private domSanitizer: DomSanitizer) { }


myReader.onloadend = (e) => {
     this.base64Image = this.domSanitizer.bypassSecurityTrustUrl(myReader.result);
     console.log(this.base64Image);
   }