AngularJS ng-csp用法及代碼示例

像互聯網上的其他任何內容一樣，AngularJS也無法幸免於難。但是，Angular確實通過基本安全漏洞提供了內置安全。因此AngularJS旨在與HTTPS(SSL /TLS)，CSP等安全措施兼容。

ng-CSP指令用於更改AngularJS的安全策略，並在需要時打破CSP(內容安全策略)的許多規則。它還將不會運行任何eval函數，並有助於停止將內聯代碼注入到應用程序中。當我們為操作係統(Windows應用程序)或瀏覽器(例如Google Chrome擴展程序，Firefox擴展程序等)開發應用程序時，這是必需的。

用法:

<element ng-csp="no-inline-style | no-unsafe-eval"> </element>

參數說明：

no-unsafe-eval：不允許使用內聯樣式或eval樣式，因此該值可以保留為空。

no-inline-style：值是用分號(;)分隔還是保留為空，但是兩者都將表現為空值。在描述的2個值中，該值可以是其中任意一個。

例：本示例顯示了ng-csp指令的用法。

<!DOCTYPE html> 
<html> 
<script src= 
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"> 
</script> 
<body ng-app="" ng-csp> 
  
<div ng-app=""> 
            <body style = "text-align:center"> 
            <h2 style = "color:green">GeeksForGeeks</h2> 
            <h2 style = "color:purple">AngularJS ng-cloak</h2> 
  
<p>The expression is {{ 10 + 10 }}</p> 
  
</body> 
  
</div> 
  
<p></p> 
  
</body> 
</html>

輸出：
當我們加載代碼時：
ngcut

AngularJS表達式執行代碼的方式，當我們使用ng-app指令時，代碼會更改。

不能僅通過查看來區分差異，而是必須使用另一種評估表達式的方式。這大大增加了評估時間，大約增加了30％。

相關用法

注：本文由純淨天空篩選整理自SohomPramanick大神的英文原創作品 AngularJS | ng-csp Directive。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。