标签: angular-dom-sanitizer

我正在尝试使用DomSanitizer来清理组件中的动态URL,我似乎无法弄清楚为此服务指定Provider的正确方法是什么.

我正在使用Angular 2.0.0-rc.6

这是我目前的组成部分:

@Component({
    templateUrl: './app.component.html',
    styleUrls: [ './app.component.css' ],
    providers: [ DomSanitizer ],
})
export class AppComponent implements OnInit
{
    public url: SafeResourceUrl;

    constructor(private sanitizer: DomSanitizer) {}

    ngOnInit() {
        let id = 'an-id-goes-here';
        let url = `https://www.youtube.com/embed/${id}`;

         this.videoUrl = this.sanitizer.bypassSecurityTrustResourceUrl(url);
    }

    ngOnDestroy() {}
}

这会导致this.sanitizer.bypassSecurityTrustResourceUrl is not a function运行时出错.

有人能告诉我一个如何正确提供DomSanitizer提供商的例子吗？谢谢!

我一直在使用带有SVG的DomSanitizer的html字符串.

在当前版本的Angular之前,这个工作得很好:

this.domSanitizer.bypassSecurityTrustHtml(content);

现在我得到一个叫做的对象

SafeHtmlImpl {changingThisBreaksApplicationSecurity: "<svg> blah </svg>"}
changingThisBreaksApplicationSecurity

现在是否有新的方法来访问DomSanitizer的输出？我应该以SafeHTML类型或其他方式接收它吗？如果它仍然过滤html,那么拥有bypassSecurityTrustHtml有什么意义呢？

明信片上的任何答案？请...

即时通讯运行angular2 rc 5一切正常,直到我重新启动我的电脑并再次启动npm,重新启动电脑前一切正常

当我试图再次启动我的项目时,有一个错误说,

node_modules/@angular/platform-browser/index has no exported member 'DomSanitizer'

即时通讯已经尝试重新安装包并从另一个快速启动中复制粘贴@angular文件但工作但仍然失败并出现相同的错误

我想我的@ angular/platform-b​​rowser有问题,但我仍然无法弄明白

官方 Angular安全指南谈到了 4 个安全上下文：HTML, Url, Style and Resource Url.
每个人都负责清理相应类型的资源。
另外，DomSanitizer服务中有 5 个方法（每个资源类型）

 - bypassSecurityTrustHtml 
 - bypassSecurityTrustScript
 - bypassSecurityTrustStyle 
 - bypassSecurityTrustUrl
 - bypassSecurityTrustResourceUrl

但是，我没有SecurityContext.NONE在官方文档中找到任何提及。它确实存在于代码中。

我假设它聚合了所有资源类型，这意味着被清理的资源可以是 HTML，其中包含样式和脚本。

是这样吗？有官方消息吗？

我正在尝试使用 来清理 URL bypassSecurityTrustResourceUrl。然而，无论我在论点中赋予什么价值，我总是得到

无法读取bypassSecurityTrustResourceUrl未定义的属性

return this.sanitizer.bypassSecurityTrustResourceUrl('http://www.google.com');

返回：

错误类型错误：无法读取bypassSecurityTrustResourceUrl未定义的属性UrlSanitizerService.push../src/app/services/urlsanitizer.service.ts.UrlSanitizerService.sanitizeURL

我看过的所有地方都说这应该清理 URL 并允许它通过 iframe 显示。我可能误解了争论的内容。任何帮助将不胜感激，谢谢！

Angular 版本：8.1.2
测试工具：Karma 和 Jasmine，由ng new

我目前正在开发我的第一个 Angular 项目。作为其中的一部分，我创建了一个调用DomSanitizer.bypassSecurityTrustResourceUrl. 我这样做是为了能够在 iframe 中使用它们。我现在想对这个管道进行测试。这是它的代码：

import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer, SafeResourceUrl } from "@angular/platform-browser";

@Pipe({
  name: 'safe'
})
export class SafeResourceUrlPipe implements PipeTransform {

  constructor(private sanitizer: DomSanitizer) { }

  transform(url: string): SafeResourceUrl | string {
    return this.sanitizer.bypassSecurityTrustResourceUrl(url);
  }

}

自动生成的规范文件看起来就像这样：

import { TestBed, async } from '@angular/core/testing';
import { SafeResourceUrlPipe } from './safe-resource-url.pipe';
import { DomSanitizer } from '@angular/platform-browser';

describe('Pipe: SafeResourceUrle', () => {
  it('should …

我使用 DomSanitizer 来清理数据库中要显示在页面上的 HTML 内容。

<div [innerHtml]="safeHtml(article.text)"></div>

其中 safeHtml 是：

safeHtml(html){
    return this.sanitize.bypassSecurityTrustHtml(html);
}

它工作完美。但我注意到该文本在网页上显示时无法选择或复制。否则，可以正常复制或选择普通字符串字段中显示的文本。

我正在开发一个应用程序，我从服务器获取 html 格式的响应。我正在使用DomSanitizer 的bypassSecurityTrustHtml 并将清理后的html 添加到我的组件() 中。

我的问题是响应中的一些元素包含标签来指示可以从该元素构建链接，例如：

<div thisIsActuallyaLink linkParam1="foo" linkParam2="bar">clickHere</div>

我想创建一个应用于innerhtml的指令，但是当显示html时，它不是用我的指令编译的...

如果有人想知道为什么转换 html 不是在服务器端完成：响应在多个应用程序中使用，并且链接必须根据应用程序具有不同的相对 url :-(

这个想法是在有角度的一侧嵌入一个 pdf 文件，该文件由 Node Express 服务器以 blob 形式返回。

之后我获取图像并创建了一个 URL

const file = new Blob([this.data], { type: 'application/pdf' });
this.fileUrl = URL.createObjectURL(file);
this.protectedUrl = this.sanitizer.bypassSecurityTrustUrl(this.fileUrl);

然后我在 html 中使用它之后

<object ng-show="content" data="{{protectedUrl}}" type="application/pdf" style="width: 100%; height: 400px;"></object>

我正在使用 Angular 10。我有一个场景来获取 html 字符串（富文本编辑器返回的值）并将其显示在我的应用程序中（使用innerHtml）。我将获得各种样式，例如背景颜色、字体颜色、突出显示文本、超链接等。

我正在bypassSecurityTrustHtml通过管道使用（代码如下），以便<styles>考虑标签。

// sanitizeHtml.pipe.ts

@Pipe({ name: 'keepHtml', pure: false })
export class SanitizeHtmlPipe implements PipeTransform {
  constructor(private sanitizer: DomSanitizer) {
  }

  transform(content) {
    return this.sanitizer.bypassSecurityTrustHtml(content);
  }
}

现在的问题是，当我获得超链接文本时<a href="http://www.someurl.com> click here </a>，这些锚链接不起作用。因此，当我单击该链接时，它不会打开href链接。

我见过像使用bypassSecurityTrustResourceUrl. 但我不能使用它，因为我无法单独从 html 内容中解析 url。

我还尝试使用其他 SO 问题中建议的如下功能，但它也没有帮助..

[innerHtml]="myHtmlContent | keepHtml | keepUrl"

[innerHtml]="myHtmlContent | keepUrl | keepHtml" // tried to reorder the pipe still didn't work

有没有办法在使用bypassSecurityTrustHtml 函数时使锚标记的href 链接正常工作？

谢谢你的时间。