AngularJS将网址更改为“unsafe：”在扩展页面中 [英] AngularJS changes URLs to "unsafe:" in extension page

问题描述

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

I am trying to use Angular with a list of apps, and each one is a link to see an app in more detail (apps/app.id):

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

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

Every time I click on one of these links, Chrome shows the URL as

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

unsafe：来自哪里？

推荐答案

您需要使用正则表达式向Angular的白名单中明确添加URL协议。只有 http ， https ， ftp 和默认情况下启用mailto 。当使用协议（例如 chrome-extension：）时，Angular将使用 unsafe：作为非白名单网址的前缀。

You need to explicitly add URL protocols to Angular's whitelist using a regular expression. Only http, https, ftp and mailto are enabled by default. Angular will prefix a non-whitelisted URL with unsafe: when using a protocol such as chrome-extension:.

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

A good place to whitelist the chrome-extension: protocol would be in your module's config block:

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

当您需要使用文件等协议时，同样的程序也适用： 和 tel：。

请参阅AngularJS $ compileProvider API文档了解更多信息。

Please see the AngularJS $compileProvider API documentation for more info.

这篇关于AngularJS将网址更改为“unsafe：”在扩展页面中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！