angular2 显示后端返回的html 安全转换
发布时间:2020-12-17 09:04:51 所属栏目:安全 来源:网络整理
导读:1、上传文件回显缩略图 input type="file" name="fileUpload" [(ngModel)]="fileUpload" (change)="sendImg($event)"/sendImg(event) { let url = window.URL.createObjectURL(event.srcElement.files[0]);}// 获取到一个不安全的临时图片链接地址 2、在angu
1、上传文件回显缩略图 <input type="file" name="fileUpload" [(ngModel)]="fileUpload" (change)="sendImg($event)"/> sendImg(event) { let url = window.URL.createObjectURL(event.srcElement.files[0]); } // 获取到一个不安全的临时图片链接地址 2、在angular2中使用,定义管道,过滤 import { Pipe,PipeTransform,SecurityContext } from '@angular/core'; import { DomSanitizer,SafeHtml,SafeStyle,SafeScript,SafeUrl,SafeResourceUrl } from '@angular/platform-browser'; @Pipe({ name: 'safe' }) export class SafePipe implements PipeTransform { constructor(protected dom: DomSanitizer) {} public transform(value: string,type: string): SafeHtml | SafeStyle | SafeScript | SafeUrl | SafeResourceUrl { switch (type) { case 'html': return this.dom.bypassSecurityTrustHtml(value); case 'style': return this.dom.bypassSecurityTrustStyle(value); case 'script': return this.dom.bypassSecurityTrustScript(value); case 'url': return this.dom.bypassSecurityTrustUrl(value); case 'resourceUrl': return this.dom.bypassSecurityTrustResourceUrl(value); default: return value; } } } 使用 <div [innerHTML]="html | safe:'html'"></div> 参考链接:https://github.com/oppoffice/... (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |