利用AngularJS繞過XSS表達(dá)式沙箱
簡介
AngularJS是一個很流行的JavaScript框架，通過這個框架可以把表達(dá)式放在花括號中嵌入到頁面中。例如，表達(dá)式1+2={{1+2}}將會得到1+2=3。其中括號中的表達(dá)式被執(zhí)行了，這就意味著，如果服務(wù)端允許用戶輸入的參數(shù)中帶有花括號，我們就可以用Angular表達(dá)式來進行xss攻擊。
一個客戶端的用戶輸入
我們來探究下HTML頁面是如何安全的防護用戶輸入。在下面這個例子中，我們會使用HTML中的Thymeleaf來編碼，然后在頁面中的div標(biāo)簽的text屬性中輸出username的值。
- <html xmlns:th="http://www.thymeleaf.org">
- <head>
- <title>AngularJS - Escaping the Expression Sandbox</title>
- </head>
- <body>
- <div th:text="${username}"></div>
- </body>
- </html>
如果username的值是alert('Rob')，輸出的頁面就是以下的樣子：
- <html xmlns:th="http://www.thymeleaf.org">
- <head>
- <title>AngularJS - Escaping the Expression Sandbox
- </title>
- </head>
- <body>
- <div><script>alert('Rob')</script>
- </div>
- </body>
- </html>
可以看到，輸出的內(nèi)容都被HTML編碼了，這就是說，目前為止這個應(yīng)用對xss攻擊是可以防御的。
添加AngularJS
當(dāng)前，我們的應(yīng)用可以防護xss攻擊。接下來，我們加入AngularJS來改下：
- <html xmlns:th="http://www.thymeleaf.org">
- <head>
- <title>Angular Expression - safe</title>
- <script src="angular-1.4.8.min.js"></script>
- </head>
- <body ng-app>
- <div th:text="${username}"></div>
- </body>
- </html>
你可以發(fā)現(xiàn)，有兩處修改了：
1. 引入了angular-1.4.8.min.js
2. 給body元素添加了ng-app
現(xiàn)在，我們的應(yīng)用就很容易受到xss攻擊了，但是，我們該如何攻擊呢?
就像我們在簡介中介紹的那樣，如果把username改成1+2={{1+2}}會怎么樣呢?
結(jié)果如下：
- <html>
- <head>
- <title>Angular Expression - safe</title>
- <script src="angular-1.4.8.min.js"></script>
- </head>
- <body ng-app="">
- <div>1+2={{1+2}}</div>
- </body>
- </html>
Angular將會把DOM解析成如下：
- <html>
- <head>
- <title>Angular Expression - safe</title>
- <script src="angular-1.4.8.min.js"></script>
- </head>
- <body ng-app="">
- <div>1+2=3</div>
- </body>
- </html>
可以看到括號里面的表達(dá)式被運行了，我們現(xiàn)在把username換成{{alert('Rob')}}試試，但是這樣做被表達(dá)式沙盒攔截了。此時，我們可以認(rèn)為我們寫的頁面是安全的，因為威脅語句被攔截了。
表達(dá)式沙盒化
在AngularJS中，沙盒化的目的并不是為了安全，更主要的是為了分離應(yīng)用，例如，用戶在獲取window的時候是不被允許的，因為這樣可以避免在你的程序中引入全局變量。
但是，如果在表達(dá)式被處理之前，有攻擊者修改了頁面模板，這樣的情況沙盒是不會攔截的。也就是說，這種情況下，任何在花括號內(nèi)的語句都能被執(zhí)行，
所以Angular官方建議開發(fā)這類應(yīng)用時，最好不要讓用戶可以修改客戶端模板。具體建議如下：
不要把客戶端和服務(wù)端模板混在一起
不要通過用戶輸入來動態(tài)的生成模板
不要用$scope.$eval運行用戶輸入內(nèi)容
可以考慮使用CSP(也不要只依賴于CSP)
這些意味著如果應(yīng)用頁面允許用戶的輸入修改到客戶端的模板中，那么這個頁面將很容易被xss攻擊，接下來我們來看看這個具體的例子：
繞過表達(dá)式沙盒
如果我們的payload被沙盒化了，我們該怎么樣繞過呢?
如果我們的username是以下的值，將會發(fā)生什么呢?
{{'a'.constructor.prototype.charAt=[].join;eval('x=1} } };alert(1)//');
}}
上面的例子中，通過覆蓋原始函數(shù)charAt，我們就可以繞過Angular的表達(dá)式沙盒，并且執(zhí)行我們的語句alert(1)。具體的攻擊原理可以參考http://blog.portswigger.net/2016/01/xss-without-html-client-side-template.html。
注意，這些測試只是在Chrome和AngularJS1.4.8中成功。在其他的瀏覽器中不知道能不能成功。
結(jié)論
如果服務(wù)端允許用戶輸入到Angular模板，這將會讓你的應(yīng)用陷入xss的攻擊中。不過話說回來，最好不要把服務(wù)端的用戶輸入和客戶端模板混合起來。關(guān)于這點你可以從這篇文章里面了解詳細(xì)的內(nèi)容https://github.com/rwinch/angularjs-escaping-expression-sandbox
