我正在从数据库中检索图像,当我将其显示为 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=">
如果我删除浏览器中的“不安全”标签,图像将正常显示。
谢谢。
最佳答案
从您的示例来看,您不需要更改白名单。顺便说一句,如果您必须设置它,imgSrcSanitizationWhitelist
是一个函数,因此应该像这样设置:
$compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|blob):|data:image\//);
对于您的问题,这是因为您的数据 URI 与正则表达式不匹配,data:image
后面缺少 /
。看来图像类型是预期的,例如(数据:image/png;
)。
尝试添加正确的图像类型(无论是否有效),请注意 png
只是一个示例。
<img ng-src="data:image/png;base64,{{logo.base64}}" />
希望这有帮助。
关于angularjs向图像添加不安全标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25448580/