Angular 2 ERROR with show image

I want to show a image in my code. The image has been saved in text format in my database. I convert the string of image in image with the following line code:

 <img [src]="'data:image/png;base64,'+zona?.fotografia">

I succeed to show the image in the page, but in the console there are the following errors:

WARNING: sanitizing unsafe URL value data:image/png;base64
GET unsafe:data:image/png;base64, net::ERR_UNKNOWN_URL_SCHEME

If i have seen the possible solution for the warning, i didn't understand the other error..

Upvotes: 0

Views: 1549

Answers (1)

Suren Srapyan
Suren Srapyan

Reputation: 68655

You need to ensure your application that this is an safe url. So you can do it via DomSanitizer service. Inject it into your component and use bypassSecurityTrustUrl method.

this.fotografia= this.sanitizer.bypassSecurityTrustUrl(`data:image/png;base64,${this.zona?.fotografia}`)

and use it in the <img [src]="fotografia">

Upvotes: 1

Related Questions