如何在模板中连接URL的角度不如其他位置安全？

(其中createThumbnailURL是一个简单的过滤器,它执行与上面相同的连接)工作完全正常.

文件说:

连接表达式使得很难推断连接值的某些组合是否使用不安全并且很容易导致XSS.

是的,静态URL总是比连接的更容易评估,我在那里看到了重点.然而,拥有可以通过简单连接构建的URL的REST-API对于我来说并不常见,并且必须完成连接.我可以在控制器甚至服务器端执行此操作,但是如何改进任何内容以将串联移动到其他位置？而什么是解决这个问题的推荐的方法？

UPDATE

这是错误的演示:http://cipher-code.de/tmp/angular3/index.xhtml

也许它与页面是XML有关.

这称为SCE(Strict Contextual Escaping): 与许多"严格"模式一样,这是可配置的.但是从V 1.2开始,它会自动设置为true.

更具体地说,在Angular认为易受攻击的情境中(如url),允许的插值更少(Strictness).您的URL连接正在"清理".

您已经意识到原因:XSS攻击.它也用于开发人员的保护:稍微错误的URL可能导致数据删除或覆盖.

您可能会感到困惑,为什么完整字符串插值ng:src="{{fullUrl}}"比字符串连接更安全ng:src="/resources/{{id}}/thumbnail".TBH,我不确定是否存在严重差异,但这些都是判断力.

你有一些替代方法可以解决这个烦恼:

1)将你的网址结构包裹在里面$sce.trustAs()

2)如果您愿意,可以在应用程序中禁用SCE

angular.module('myApp').config(function($sceProvider) {
    $sceProvider.enabled(false);
});

更正:

您无法从指令调用$ sce服务.只有$ scope服务可以直接使用.但是您可以使用函数(或使用函数的指令).

    $scope.createUrl = function (strName) {
        var truststring = '/resources/' + strName + '/thumbnail';

        return truststring;
    }

你的指令调用看起来像

在这种情况下,如果将连接包装在函数中,则可能甚至不需要对其进行去清理,因为您不会破坏SCE规则.