Soru Açısal-sıhhileştirmenin amacı nedir?


Ben sadece açısal ve açıklayıcı yönergeleri için örneklerden geçiyordum İŞTE ve aşağıdaki örnekle karşılaştık:

<!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>

Örnek canlı bir örnek olarak görülebilir İŞTE.

Sorum şu, yüklenmekte olan dosyalar hakkında, aşağıdaki betiğin neden yüklü olduğunu anlamıyorum:

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

Yukarıdaki betiğin amacı nedir?

DÜZENLE:: : Bu modül için git repo ve dokümanları açısal olarak buldum İŞTE. ama yine de bu betiğin amacını anlamıyorum, belgelerin tek bir örneği bile yok.

JQuery'de adil bir kod yazdım, bu yüzden birisi bunu jQuery terimlerinde açıklayabilir mi?


17
2017-10-19 08:32


Menşei




Cevaplar:


Eklerseniz angular-sanitize komut dosyası, HTML'yi jetonlarla ayrıştırarak girdileri dezenfekte edilir. Tüm güvenli belirteçler (bir beyaz listeden), daha sonra düzgün şekilde kaçtı html dizesine geri serileştirilir. Bu, güvensiz girdinin döndürülen dizgeye dönüştürülmeyeceği anlamına gelir.

Bundan ilham alan küçük bir örnek ekledim Blog yazısı. Bu komut dosyasını var app = angular.module("app", ["ngSanitize"]); html bağlantıları doğru şekilde oluşturulur. Ancak, bu açıklamayı ve uncomment'ı yorumlarsanız var app = angular.module("app", []); Aşağıdaki hata iletisi yükseltildi: 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>


26
2017-10-19 08:35



teşekkürler, küçük bir örnek verebilir misiniz? - Alexander Solonik
Bu demek oluyor mu ng-sanitize sadece html girişinin dinamik olduğu veya istemci girdisinden geldiği durumlarda faydalıdır? Bu nedenle, yalnızca kendi görünümlerimize / direktiflerimize html yüklemek için yalnızca statik html ve şablon URL'leri kullanırken (kendi güvenilir alanımızdan (https) veya şablon önbelleğinden) yararlanmanıza gerek yoktur. ng-sanitize? Veya başka durumlar var mı ng-sanitize kullanılmalıdır. - Wilt
ng-sanitize Statik html için gerekli değildir, ancak html girişi dinamik olduğunda veya istemci girdisinden doğrudan veya dolaylı olarak geldiğinde kullanılmalıdır. - Jaco