Question

在AngularJS中，在以下场景中，Firefox将unsafe:放在以下列方式生成的URL前面。然后它会显示一个错误页面，上面写着“地址未被理解”。这是我本地PC上的文件请求。

链接：

<li ng-repeat="fruit in fruits">
    <a href="{{ fruit.link }}">{{ fruit.title }}</a>
</li>

阵列：

$scope.fruits = [
    {   "title"     :   "Orange",
        "link"      :   "fruits_orange.html"  }
];

Answer 1

您看到此提交的副作用： https://github.com/angular/angular.js/commit/9532234bf1c408af9a6fd2c4743fdb585b920531旨在解决一些安全隐患。

此提交为以file://开头的网址引入了非向后兼容的更改（后来在https://github.com/angular/angular.js/commit/7b236b29aa3a6f6dfe722815e0a2667d9b7f0899放宽了

我假设您使用的是1.0.5或1.1.3 AngularJS版本之一。如果是这样，您可以通过配置file://来重新启用对$compileProvider网址的支持，如下所示：

angular.module('myModule', [], function ($compileProvider) {

  $compileProvider.urlSanitizationWhitelist(/^\s*(https?|ftp|mailto|file):/);

});

或在Angular 1.2.8及以上版本中：

angular.module('myModule', [], function ($compileProvider) {

  $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|file):/);

});

Answer 2

向控制器添加白名单。

对于Angular.js 1.2：

app.config(['$compileProvider', function($compileProvider) {
    $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|file|tel):/);
}]);

对于Angular 1.1.x和1.0.x，请使用urlSanitizationWhitelist。请参阅reference。

Answer 3

    angular.module('somemodule').config(['$compileProvider' , function ($compileProvider)
    {
          $compileProvider.urlSanitizationWhitelist(/^\s*(https?|ftp|mailto):/);
    }]);

Answer 4

我正在使用angular 1.4.0，并且以下格式有效：

ng-href="http://{{baseURLHref}}{{baseURLPort}}/routingPathName"

在http://的开头添加ng-href有助于摆脱unsafe附加的ng-Sanitize

如果你在https，那么对所有内容进行硬编码应该不会有问题。
但是，如果您的系统必须同时适用于这两种环境，则可能需要使用location.protocol

我在$rootScope中设置变量（它们有助于解决使用我网站上的css的代理服务器的问题）

angular.module('myApp').run(function ($route, $rootScope, $location) {
    $rootScope.baseURLHref = '';
    $rootScope.baseURLPort = '';
    if($location.host() != 'localhost'){
      $rootScope.baseURLHref = $location.host();
      $rootScope.baseURLPort = ':' + $location.port();
    }
    ...

Answer 5

<a href="{{applicant.resume}}" download> download resume</a>


var app = angular.module("myApp", []);

    app.config(['$compileProvider', function($compileProvider) {
         $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|local|data|chrome-extension):/);
        $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|local|data|chrome-extension):/);

        }]);

角度不安全的链接

5 个答案: