Unsafe prefix for blob links

[maxaon]

Links to blob images marked with prefix "unsafe:"

During linking of ngImg image link is set via $compile.$set which checks normalized value via regular expression:

  if (normalizedVal !== '') {
    if ((key === 'href' && !normalizedVal.match(aHrefSanitizationWhitelist)) ||
        (key === 'src' && !normalizedVal.match(imgSrcSanitizationWhitelist))) {
      this[key] = value = 'unsafe:' + normalizedVal;
    }
  }

where imgSrcSanitizationWhitelist equals to /^\s*(https?|ftp|file):|data:image\//
This RegExp doesn't allow blob link, which created using URL.createObjectURL
Created link using Chrome: blob:http%3A//127.0.0.1%3A8080/38272f8d-7435-4cfd-bb64-93c8ca8d92c4
Created by Firefox: blob:53210633-5257-4767-b862-34c3cc50013c

Related issue #2570 Affected versions till v1.2.0-rc.2

[petebacondarwin]

You can modify this whitelist in a config block using the $compileProvider. Something like this...

myModule.config(['$compileProvider', function($compileProvider) {
  var oldWhiteList = $compileProvider.imgSrcSanitizationWhitelist();
  $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|blob):|data:image\//);
});

[mcfedr]

Is there any reason why this fix should not be in the standard whitelist? that way everyone using doesnt have to google, find this page, and do it himeself.

[divyachandana]

    <a href="https://github.com/%7B%7Bapplicant.resume%7D%7D" download> download resume</a>


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

[kumarendeavour]

    <a href="https://github.com/%7B%7Bapplicant.resume%7D%7D" download> download resume</a>


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

can you please explain me step by step process, how to use this, i dont know where to add the aHrefSanitizationWhitelist and in which config file, or in some Ts file. I am very new to Angular ,and facing the issue to show images from fileshare

[AllanPinheiroDeLima]

I think I misunderstand this, if it is important and it makes a security flaw on Angular, why it works when using background-image into CSS but not into image ?