角衛生的目的是什麼？

我只是通過例子去一個角和的OpenLayers指令HERE並遇到了下面的例子：角衛生的目的是什麼？

<!DOCTYPE html> 
<html ng-app="demoapp"> 
    <head> 
    <script src="../bower_components/openlayers3/build/ol.js"></script> 
    <script src="../bower_components/angular/angular.min.js"></script> 
    <script src="../bower_components/angular-sanitize/angular-sanitize.min.js"></script> 
    <script src="../dist/angular-openlayers-directive.js"></script> 
    <link rel="stylesheet" href="../bower_components/openlayers3/build/ol.css" /> 
    <script> 
     var app = angular.module('demoapp', ['openlayers-directive']); 
     app.controller('DemoController', [ '$scope', function($scope) { 
      angular.extend($scope, { 
       center: { 
        lat: 0, 
        lon: 0, 
        autodiscover: true 
       } 
      }); 
     }]); 
    </script> 
    </head> 
    <body ng-controller="DemoController"> 
    <openlayers ol-center="center" height="400px"></openlayers> 
    <h1>Center autodiscover example</h1> 
    <form> 
     Latitude : <input type="number" step="any" ng-model="center.lat" /> 
     Longitude : <input type="number" step="any" ng-model="center.lon" /> 
     Zoom : <input type="number" step="any" ng-model="center.zoom" /> 
     <button ng-click="center.autodiscover=true">Discover position</button> 
    </form> 
    </body> 
</html>

的例子可以被看作是一個活生生的例子HERE。

我的問題是關於正在加載的文件，我不明白爲什麼要加載的腳本如下：

<script src="../bower_components/angular-sanitize/angular-sanitize.min.js"></script>

什麼是上面的腳本的目的是什麼？

編輯::：我發現了git的回購和這裏的文檔中此模塊的角度HERE。，但我仍然不明白這個腳本的目的，文檔甚至沒有一個例子。

我已經在jQuery中編碼了一個公平的位，所以有人可以用jQuery術語解釋這個嗎？

來源

2015-10-19 Alexander Solonik

如果您包含angular-sanitize腳本，則通過將HTML解析爲令牌來對輸入進行消毒。然後將所有安全令牌（來自白名單）序列化回正確轉義的html字符串。這意味着沒有不安全的輸入可以使它進入返回的字符串。

我已經包含了一個小例子，其靈感來源於這個blog post。如果您使用var app = angular.module("app", ["ngSanitize"]);運行此腳本，則html鏈接將正確呈現。但是，如果你對此有何評論這種說法並升起取消註釋var app = angular.module("app", []);以下錯誤信息：Error: [$sce:unsafe] Attempting to use an unsafe value in a safe context.

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <link rel="icon" type="image/x-icon" href="favicon.ico"> 
 

 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.1/angular.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.1/angular-sanitize.min.js"></script> 
 
    <!-- BEGIN disable refresh --> 
 
    <script type="text/javascript"> 
 
    //Including ngSanitize ensures html links get properly sanitized 
 
    var app = angular.module("app", ["ngSanitize"]); 
 
    //If you use this code instead no html links get displayed 
 
    //var app = angular.module("app", []); 
 

 
    app.controller("mainController", function($scope) { 
 
     var main = this; 
 

 
     main.links = [ 
 
     "<a href='http://google.com'>Google</a>", 
 
     "<a href='http://odetocode.com'>OdeToCode</a>", 
 
     "<a href='http://twitter.com'>Twitter</a>" 
 
     ]; 
 
    }); 
 
    </script> 
 

 
</head> 
 

 
<body ng-app="app"> 
 
    <section ng-controller="mainController as main"> 
 
    <nav> 
 
     <ul> 
 
     <li ng-repeat="link in main.links" ng-bind-html="link"> 
 
     </li> 
 
     </ul> 
 
    </nav> 
 
    </section> 
 
</body> 
 

 
</html>

來源

2015-10-19 08:35:55 Jaco

感謝，你可以給一個小例子嗎？ –

是否意味着'ng-sanitize'僅在html輸入是動態的或來自客戶端輸入的情況下有用？因此，當僅使用靜態html和模板url（來自我們自己的受信任域（https）或模板緩存）來加載html視圖/指令時，不需要'ng-sanitize'？或者在其他情況下應該使用ng-sanitize。 – Wilt

靜態html不需要'ng-sanitize'，但是當html輸入是動態的或者來自客戶端輸入時（直接或間接輸入），應該使用'ng-sanitize'。 – Jaco

角衛生的目的是什麼？

回答

相關問題