Angular中使用DomSanitizer防范跨站腳本攻擊類(XSS)的安全問題


需要用iframe引用一個外部的url。

直接使用接口獲取到url,給iframe的src賦值時,報了個ERROR Error: unsafe value used in a resource URL context.大概的意思就是資源url不安全

 然而我們自己的項目里面有人使用過iframe,果斷搜代碼,找到這么一段代碼:

constructor(private sanitizer: DomSanitizer,
){}
this.securityUrl = this.sanitizer.bypassSecurityTrustResourceUrl(iFrameUrl);
 

這個DomSanitizer是個啥?看起來是Angular提供的

Angualr的文檔里面這樣寫

調用任何 bypassSecurityTrust... API 都會禁用 Angular 對傳入的值的內置凈化機制。 要小心翼翼的檢查和審計所有的值和到該調用的代碼執行路徑。 要確保任何一個用戶數據都針對這個安全上下文進行過適當的轉義(escape)。

比如,如果要在 <a [href]="someValue"> 的鏈接中綁定一個 URL,someValue 將會被凈化, 以防范攻擊者注入 javascript: 之類的 URL,並借此在網站上執行代碼。

在特定場景下,可能要禁用凈化機制,比如,如果應用程序真的需要生成具有動態值的 javascript: 鏈接。 用戶可以通過使用 bypassSecurityTrust... 方法來構建出一個值,以繞過安全性檢查,並在模板中綁定它。

這種場景其實非常罕見,必須特別小心,避免引入跨站腳本攻擊(XSS)類的安全風險。

當使用 bypassSecurityTrust... 時,請盡量確保盡早調用該方法,並且讓他盡可能接近值的來源,以便能更容易地驗證使用它時有沒有引入安全風險。

如果該值本身是安全的,則不需要繞過安全性檢查,比如那些沒有使用可疑協議的 URL 或者不包含危險代碼的 HTML 片段。 凈化器會確保值的安全性。

DomSanitizer提供的方法

1. sanitize()

為在給定的 SecurityContext 中使用而對 value 進行轉義

如果這個值在這個上下文中是可信的,則該方法會解開所包含的安全值,並且直接使用它;否則,這個值就會根據給定的安全上下文凈化成安全的,比如替換那些具有不安全協議(例如 javascript:)的 URL。 該實現負責確保在給定的上下文中可以絕對安全的使用該值。

2.  bypassSecurityTrustHtml()

繞過安全檢查,並信任給定的值是一個安全的 HTML。只有當要綁定的 HTML 是不安全內容(比如包含 <script>)而且你確實希望運行這些代碼時,才需要使用它。 凈化器會確保安全 HTML 的完整性,因此在大多數場景下都不需要使用該方法。

3. bypassSecurityTrustStyle()

繞過安全檢查,並信任給定的值是一個安全的樣式(CSS)。

4. bypassSecurityTrustScript()

繞過安全檢查,並信任給定的值是一個安全的JavaScript。

5. bypassSecurityTrustUrl()

繞過安全檢查,並信任給定的值是一個安全的樣式 URL。也就是說該值可安全地用在鏈接或 <img src> 中。

 6. bypassSecurityTrustResourceUrl()

繞過安全檢查,並信任給定的值是一個安全的資源 URL。也就是說該地址可以安全的用於加載可執行代碼,比如 <script src><iframe src>

警告: 使用不可信的用戶數據調用此方法將會讓你的應用暴露在 XSS 安全風險之下!

https://angular.cn/api/platform-browser/DomSanitizer#description

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM