角度不安全的链接

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,旨在解决一些安全隐患.

这次提交介绍了开始的URL非向后兼容的变化file://(这是随后在放宽https://github.com/angular/angular.js/commit/7b236b29aa3a6f6dfe722815e0a2667d9b7f0899

我假设您使用的是1.0.5或1.1.3 AngularJS版本之一.如果是这样,您可以file://通过如下配置重新启用对URL的支持$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. 见参考。