angular4 上传本地图片,将拿到的files转化为url地址,提示sanit
发布时间:2020-12-17 08:32:08 所属栏目:安全 来源:网络整理
导读:??最近用angular4做项目,上传图片时在onchange里面拿到files文件,将files文件转化为url地址显示的时候,发现console里面报错,同时angular4提示WARNING: sanitizing unsafe URL value,最后在谷歌找到解决办法。下面附上我的代码截图。 ??html中使用input
??最近用angular4做项目,上传图片时在onchange里面拿到files文件,将files文件转化为url地址显示的时候,发现console里面报错,同时angular4提示WARNING: sanitizing unsafe URL value,最后在谷歌找到解决办法。下面附上我的代码截图。 ??html中使用input标签 <input #file2 type="file" id="logo" value="" name="file" accept="image/*" multiple [disabled]="isInput" /> ??在onchange里面拿到files文件 // 获取图片文件 let files = this.files; // 转化为url let imgurl = window.URL.createObjectURL(files[0]); ??这时按照我以前用angular1的做法直接把这个地址绑定到img标签上就可以预览本地上传的图片,但是,angular4却报了WARNING: sanitizing unsafe URL value,还好找到了解决办法。 1:在组件里面引入angular内置的StampComponent模块 import {StampComponent} from "../base/stamp/stamp.component"; 2:我喜欢在构造器里面定义属性 constructor(private sanitizer:DomSanitizer) { } 3:将地址转化为安全地址 let sanitizerUrl = self.sanitizer.bypassSecurityTrustUrl(imgurl); ??最后就可以把地址放入img的src上面了。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |