如何清理 Angular 4 的 url答案

【问题标题】：how to sanitize url for angular 4如何清理 Angular 4 的 url
【发布时间】：2018-04-09 20:43:09
【问题描述】：

我正在尝试使用 Object html 标签来显示我在服务器端制作的 PDF，但是当我对 url 进行硬编码时它可以工作，当我将它放入变量中时，它给了我一个 Angular 错误，并且没有显示任何内容：

unsafe value used in a resource URL context

我首先尝试使用消毒剂，但我读到它只能与支持href / src 的标签一起使用，在我的情况下，它的数据如下：

<object data="{{pdfSrc}}" type="application/pdf" width="100%" height="100%">

    </object><br>

这是我首先尝试的：

pdfSrc: any =this.sanitizer.bypassSecurityTrustUrl('http://my_url.com') ;

谢谢你

【问题讨论】：

标签： angular

【解决方案1】：

你需要用来绑定sanitizer的结果

[data]="pdfSrc"

因为

data="{{pdfSrc}}"

仅用于导致清理信息被剥离的字符串绑定

【讨论】：

【解决方案2】：

您的问题的标题是“如何清理 Angular 4 的 url”，但实际上您没有进行清理，而是绕过了安全检查。你应该改用sanitizeUrl。

【讨论】：

【解决方案3】：

我找到了基于 Günter Zöchbauer 答案的解决方案，我使用了他的方法，但我传递的不仅仅是变量，而是像这样对 URl 进行清理的函数：

    <object [data]="cleanURL(pdfSrc)" type="application/pdf" width="100%" height="100%">

    </object>

这里是 CleanURL 函数：

cleanURL(oldURL ): SafeUrl {
 return   this.sanitizer.bypassSecurityTrustResourceUrl(oldURL);
 }

【讨论】：