保护 Angular JS 表达式答案

【问题标题】：Secure Angular JS expressions保护 Angular JS 表达式
【发布时间】：2019-09-03 04:58:12
【问题描述】：

我正在编辑一个现有代码，其中包含许多 Angular js 表达式，我们的自动化测试系统将这些表达式检测为不安全。我能够看到下面描述我的案例的文章，但我无法找到任何具体的方法来解决它（我主要看到 $watch 和 $apply）。我想我需要知道我在哪里对代码进行更改？

我的代码中的示例 sn-ps：

【问题讨论】：

这是我第一次听说$watch() 和$apply() 可被利用。老实说，我不知道它们如何导致任何漏洞。
我认为这是在将内容传递给方法之前在 html 级别过滤内容；如果是这样，那么我们有静态内容或根本没有的部分呢？我也不相信某些部分是脆弱的，我很想就此获得一些其他意见。
您应该注意的一件事是，当在 HTML 中绑定文本时，不要直接使用 {{ variableName }} 绑定，因为它将执行此变量中的内容。应该使用不会呈现或执行内容的 ng-bind-html。这将有助于防止 XSS 攻击。
@Lex 你应该看到我发布的答案，这绝对是可以利用的。
@codymikol 您可以在自己的客户端上运行任意代码。我仍然看不出这是一种“利用”。您没有在服务器上执行代码。您甚至没有在其他用户的浏览器中执行代码。您正在自己的浏览器中执行代码。

【解决方案1】：

您的代码看起来非常好。我认为您缺少的是该警告的“传递用户提供的内容”部分。

在第一个示例中，您传递给 $apply 的唯一内容是您定义的函数，与第二个示例相同。在最后一个示例中，您没有向 $apply 传递任何内容。

他们有这些警告的原因是因为可以向 $apply 传递一个字符串来评估 $scope 上的表达式。

同理

{{$scope.hello = 'Hello, World'}}

将设置 $scope 的 hello 属性

$scope.$apply('hello = "Hello, World"')

将完全一样。现在假设您将用户定义的内容传递给此

$scope.$apply(userPassedString)

现在您已经让用户能够在您的应用函数中运行任意 javascript 表达式。

为了确切了解我的意思（以及它是如何被利用的），我在这里为您创建了一个 codepen 演示：https://codepen.io/codymikol/pen/bGbzbvp

（您必须在 HTML 中向下滚动才能看到脚本，我很懒，不会将其链接为单独的 JS 文件 \_('__')_/

另外，如果你真的想了解上面的 sn-p 是如何工作的（以及我在哪里了解到以这种方式获取函数构造函数），你应该通过 liveoverflow 观看这个视频：https://www.youtube.com/watch?v=DkL3jaI1cj0

当 AngularJS 团队试图围绕范围表达式创建一个沙箱以防止 XSS 时，这已被退回。有很多视频详细介绍了人们用来绕过沙盒的不同漏洞。由于创建沙盒的复杂程度以及被利用的频率，他们决定将其完全删除，并警告开发人员不要以这种方式传递用户内容。

【讨论】：

非常感谢您的详细解释！它有很大帮助:)
所以基本上我只需要过滤传递给 $apply 的变量？你知道任何可以有效地做到这一点的图书馆吗？删除那些没有传递给它的值是否可以？
您永远不应该将用户数据传递给 $apply。 Angular 团队尝试实现一个过滤器，但多次失败，最终将其移除。您没有将用户数据传递给 $scope.apply，而是传递了一个匿名函数。所以这可以$scope.$apply(function(scope){ //do things with scope here }) 这不行` $scope.$apply($scope.userDefinedVariable);其中用户定义的变量是一个字符串，因此在相同的情况下评估的是一个 angularJS 表达式 ==> {{ userDefinedVariable }} 将在您的视图中。