问题标签 [angular-dom-sanitizer]

我有一个使用 DomSanitizer 绕过 HTML 的管道。它正在绕过它。但是，它将元素内的所有属性转换为小写。管道看起来像这样：

生成字符串的组件如下所示：

但输出最终是这样的：

如何防止 DomSanitizer 更改属性并保持属性不变？

我有一个所见即所得的编辑器（angular-editor）：

在编辑器下方，我尝试使用ngx-highlightjs：

因此，当我在编辑器中输入类似 的<p>test</p>内容时，我希望代码 (ngModel)<p>test</p>改为<p>test</p>在<code></code>.

我尝试过使用管道：

它不起作用，无论如何值可以是 HTML、JS、任何语言，也可能是多种语言，所以我不能同时绕过 HTML 和 JS（我猜是因为有 trustHTML 和 trustScript 方法）。

那么，怎么code可能<p>test</p>（答案不应该只涵盖HTML，而是任何语言<script>...</script>）而不是<p>test</p&gt？

我认为我不能使用 DomSanitizer 类，因为它涵盖了 HTML 或脚本，而不是两者。

注意：我什至不关心安全性，我只会使用该应用程序。

我在我的网页中使用 angular(8) 并希望将几个iframes 显示为innerHTML.

默认情况下，角度 domsanitizer 会删除有风险的元素。我知道我可以通过使用bypassSecurityTrustHtml功能等来禁用它。( https://angular.io/api/platform-b​​rowser/DomSanitizer )

然而，由于内容将是用户生成的，我不能简单地绕过 Domsanitizer，因为它太冒险了。但是我想知道是否可以允许某些已知的域，例如我自己的域。因此，我需要为 Sanitizer 提供某种具有安全域的白名单。到目前为止，谷歌没有返回任何有用的东西，所以我想知道：这可能吗？如果可以，我会怎么做？

在 Angular 组件中，我们可以注入 DomSanitizer 并使用它。

但是如何在不将 DomSanitizer 注入构造函数的情况下使用它？

我不想导入DomSanitizer到我的类中，然后将其作为第二个参数传递给 keepHtml()。

我希望在函数文件中完成整个实现。

我也不想将函数 keepHtml() 转换为类方法。

我参考了https://angular.io/guide/security#xss并尝试在我们的 Intranet sharePoint 网站上的网页上显示 PDF

这是模板：help.component.html：

和组件：help.component.ts

我尝试按照建议附加 &embedded=true： How to fix Refused to display in a frame because it set 'X-Frame-Options' to 'sameorigin

但这也不起作用。请指导

尝试使用SafeUrl这样的设置背景图像。

img标签呈现，但div不呈现。

有任何想法吗？

这是 Stackblitz 演示：

https://stackblitz.com/edit/angular-blob-to-safe-url?file=src%2Fapp%2Fapp.component.html

图像加载如下：

我在 Angular 9 应用程序中使用 ng-dompurify，并且我用 NgDompurifyDomSanitizer 实现替换了默认的 Angular DomSanitizer。

这样在做类似的事情时

DomPurify 将用于清理该 HTML 字符串。

这在我不使用 Ivy 时效果很好，但是当我使用 Ivy 时，渲染的 HTML 会使用 NgDompurifyDomSanitizer 以外的东西进行清理。我不确定在这种情况下使用的是什么消毒剂，但我看到样式属性已从 html 元素中剥离，如果使用 NgDompurifyDomSanitizer 则不会发生这种情况。

我在这里整理了一个 stackblitz 示例来显示该问题：https ://stackblitz.com/edit/angular-domsanitizer-ivy 。如果您进入 stackblitz 设置并取消选中“启用常春藤”复选框，您可以看到文本呈现为红色，但是当它被选中时，内联样式被剥离并且文本为黑色。

我不确定我是否需要做一些特别的事情才能使这项工作与 Ivy 一起工作，或者 Ivy 是否不支持它。我整天都在用谷歌搜索试图弄清楚，但我没有任何运气。

我会很感激有人可能有任何见解。

编辑：对于那些感兴趣的人，这似乎是一个错误，我已经打开了一张票：https ://github.com/angular/angular/issues/36794

我们正在开发一个 Angular 8 PWA 应用程序。该应用程序的一部分允许我们的客户创建自己的自定义表单来收集数据。

作为开发的一部分，我们正在组合一组函数来与数据交互。然而，由于我们很难为每个场景提供一个函数，我们正在考虑允许用户管理员创建他们自己的脚本以保存在我们的数据库中并在表单中执行。

为了实现这一点，我们正在考虑通过脚本DomSanitizer.bypassSecurityTrustScript()

或者可能是“邪恶”的 javascripteval()

这将在一个隔离的函数中运行，我们将在其中提供对应用程序中有限功能集的访问。例如：

其中 fnGetFieldValue() 和 setFnFieldValue 将被定义为脚本可访问的函数以运行一组有限的操作。

问题是我们确实对允许此功能存在重大安全问题，即明显的 XSS 脚本攻击。是否有任何策略可以安全地运行这些用户自定义脚本？

鉴于 Squarepace、Zoho 等公司，powerapps 允许用户运行自定义代码，这些解决方案不也容易出现同样的问题吗？有谁知道他们如何绕过 eval 的“邪恶”使用？

感谢您对此的想法以及是否有任何 npm 包可以处理此问题以清理一些相关功能？

我有一个非常奇怪的问题，即在注入 html 时未应用 css 规则这是注入 html 的代码：

在模板中：

我添加了一个 CSS 规则

但是，JognDoe 仍然是灰色的，而 JaneDoe 按预期将 Doe 变成了红色。为什么 Johns'Doe 不呈现红色？

在检查器中呈现的 HTML 如下所示：

对我来说，Johndoe 没有理由是灰色的..：

我用这个问题组装了一个小沙箱：

https://stackblitz.com/edit/angular-playground-pyjqju

我有一个字符串格式的受信任的 Javascript/Angular 脚本，我想在 Angular 组件中执行它。我知道这就是 Domsanitizer bypassSecurityTrustScript() 的作用。Angular Domsanitizer

但是，当尝试在我的组件中运行时，什么也没有发生。我如何使用它从字符串运行 js 代码？这就是我到目前为止所做的，在下面以及在 stackblitz Custom Script StackBlitz中提前致谢。

我的组件.ts