Angular 7中的unsafe:data:image/jpeg; base64，net :: ERR_UNKNOWN_URL_SCHEME [英] unsafe:data:image/jpeg;base64, net::ERR_UNKNOWN_URL_SCHEME in Angular 7

问题描述

我正在从服务获取作为base64 blob的映像，并且将绑定到看法.但是我遇到了一个问题.如何将URL清理为受信任的网址.我已经尝试过消毒液了，但是没有运气..请帮帮我..

I am getting image as base64 blob from service and i am binding into view. But i am facing some issue.How can I sanitize the url into trusted url. I have tried with sanitizer but no luck.. please help me out..

html代码:

<img src="data:image/jpeg;base64,{{inspectionDetails.reportImage}}" width="100%" height="100%" alt="Image" />

ts代码:

this.ImgUrl = this.inspectionDetails.reportImage;
this.base64Image = this._sanitizer.bypassSecurityTrustResourceUrl(this.ImgUrl);

推荐答案

您需要进行此更改

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

或

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

那么您的HTML将是

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

这应该有效

public ImgUrl = ' ';

这篇关于Angular 7中的unsafe:data:image/jpeg; base64，net :: ERR_UNKNOWN_URL_SCHEME的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！