ng-src doesn't work in Chrome app, even with ng-csp

[Pitel]

As the description says.

I'm writing Chrome app, and <img ng-src="img/photo{{id}}.jpg"> fails on Chrome's CSP, even when I use ng-csp.

ng-include with ng-csp works, but not without. Which is incosistent with Chrome doc, which says that I shouldn't need to use ng-csp since Angular 1.1.x. But I gues it's just mistake in Chrome doc.

[0x0ece]

+1, same issue (currently testing angular v1.2.0-rc2, while stable v1.0.7 works)

Edit: it seems the bad guy is line 4436 (angular.js v1.2.0-rc2)
(key === 'src' && !normalizedVal.match(imgSrcSanitizationWhitelist))) {

@Pitel did you solve by the chance?

[eventignite]

Same problem here, ng-src fails on Chrome's CSP

[Pitel]

My solution:

var myModule = angular.module('myApp', [...], function($compileProvider) {
    ...
    $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|chrome-extension):|data:image\//);
    $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|chrome-extension):/);
});

The original whitelist regexp is taken somewhere from Angular source code, and chrome-extension scheme was added.

[IgorMinar]

if the image is coming from the same origin as the app it self, it should not be necessary to augment the whitelist.

isn't this the case with chrome extensions?

[chirayuk]

I'll take a look …

[chirayuk]

@Pitel's solution is the way to go.  This won't be in core since it's browser specific.  Closing.

[dance-cmdr]

Pitels solution works. also don't forget to use ng-src instead of src in img tags. I did :P

[tphalp]

Thank you, @Pitel . I'm using node-webkit with the app:// protocol, and your solution fixed it for me.