javascript - 在 angularjs 中使用 $sce 或 Strict Contextual Escape 有什么好处，为什么 react 不需要这样做？

我感到困惑的是，我无法真正看到在 angularjs 中使用 SCE 的真正好处(即使在阅读了文档之后)关于安全性好处，并想知道为什么 React 不需要在其中包含这样的 SCE？

所以问题只是为了重新组合:

SCE 的好处

为什么 Angular 可以，而 React 不可以？

最佳答案

在 React 中，如果你使用 {text} 那么它会自动转义并且不会发生任何不好的事情。所以默认情况下你是受到保护的。如果你使用 dangerouslySetInnerHTML={{__html: text}} 那么你有责任清理 text 所以没有什么不好的事情发生，这就是为什么 这个名字很危险 :)

Angular 也有类似的方法。它处理任何可能包含危险 HTML 的字符串，因此它会自动对其进行转义。$sce 本质上是 React 的 dangerouslySetInnerHTML ，因为它将文本包装在一个对象中，告诉 Angular {sceWrappedText} 不应自动转义。而且，就像在 React 中一样，您有责任清理它。
$sce 确实带有一些辅助清理程序，例如 parseAsHtml，您可以使用它们在输出 HTML 之前对其进行清理。我认为它使用 $sanitize 服务并删除诸如 ng-click 之类的东西。

澄清 :不应该使用 $sce 和 dangerouslySetInnerHTML 认为它们会神奇地使不安全的(用户输入的)字符串安全地显示为 HTML。它们存在是因为默认情况下一切都被转义了。作为开发人员，您有责任决定可以安全使用的内容:

它来自经过 sanitizer 的服务器；

您使用一些客户端代码( https://github.com/mganss/HtmlSanitizer 、 https://www.npmjs.com/package/sanitize-html 和许多其他代码)对其进行了 sanitizer

它是一段 HTML，你将自然安全的片段粘合在一起(想想 '<b>' + parseInt(this.props.numberFromTextInput, 10) + '</b>' )

默认是什么意思:

Controller :

$scope.text = '<b>foo</b>';

模板:

<div>{{text}}</div>

会输出“你好，<b>foo</b> !”

尽管
$scope.text = $sce.trustAsHtml('<b>foo</b>');
会输出“你好， foo !”

与 React 的 dangerouslySetInnerHTML 相同，其中 <div dangerouslySetInnerHTML={{__html: '<b>foo</b>'}} /> 会输出“你好， foo !”而 <div>{'<b>foo</b>'}</div> 将被转义。

关于javascript - 在 angularjs 中使用 $sce 或 Strict Contextual Escape 有什么好处，为什么 react 不需要这样做？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35557649/