AngularJS 将扩展页面中的 URL 更改为“unsafe：”

javascript angularjs security google-chrome-extension

2022-08-30 01:38:21

我正在尝试将Angular与应用程序列表一起使用，每个应用程序都是一个链接，可以更详细地查看应用程序（）：apps/app.id

<a id="{{app.id}}" href="apps/{{app.id}}" >{{app.name}}</a>

每次我点击其中一个链接时，Chrome 都会将网址显示为

unsafe:chrome-extension://kpbipnfncdpgejhmdneaagc.../apps/app.id

从何而来？unsafe:

答案 1

您需要使用正则表达式将URL协议显式添加到Angular的白名单中。默认情况下，只有、和处于启用状态。当使用诸如 .httphttpsftpmailtounsafe:chrome-extension:

将协议列入白名单的好地方是模块的配置块：chrome-extension:

var app = angular.module( 'myApp', [] )
.config( [
    '$compileProvider',
    function( $compileProvider )
    {   
        $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|chrome-extension):/);
        // Angular before v1.2 uses $compileProvider.urlSanitizationWhitelist(...)
    }
]);

当您需要使用协议（如和）时，相同的过程也适用。file:tel:

有关详细信息，请参阅 AngularJS $compileProvider API 文档。

答案 2

如果有人对图像有这个问题，以及：

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