angularjs为图像添加了不安全的标签

Question

我正在从数据库中检索图像,当我将其显示为base64文件时,angular会为其添加一个不安全的标记.我怎样才能解决这个问题？这就是我使用的

<img ng-src="data:image;base64,{{logo.base64}}" />

这是结果

<img  ng-src="data:image;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxQTEhMUExMWFB=" src="unsafe:data:image;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBx=">

如果我删除浏览器中的"不安全"标签,图像显示正常.

谢谢.

Answer 1

在您的示例中,您无需更改白名单.顺便说一句,如果你必须设置它,它imgSrcSanitizationWhitelist是一个函数,所以它应该像这样设置:

$compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|blob):|data:image\//);

对于您的问题,这是因为您的数据URI与正则表达式不匹配,/之后data:image缺少.似乎图像类型是预期的,例如(data:image/png;).

尝试添加正确的图像类型,如果它工作与否,请注意这png只是一个例子.

<img ng-src="data:image/png;base64,{{logo.base64}}" />

希望这可以帮助.