Angularjs Changes Urls to "Unsafe:" in Extension Page

AngularJS changes URLs to unsafe: in extension page

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:.

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(...)
    }
]);

The same procedure also applies when you need to use protocols such as file: and tel:.

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

How to avoid adding prefix unsafe to javascript by AngularJs?

Try to circumvent the restrictions by writing a custom directive:

var app = angular.module('myApp', []);

app.directive('bookmarklet', function () {
    return {
        restrict: 'A',
        scope: {},
        link: function($scope, element, attrs) {
            if (element[0].tagName !== 'A') {
                return;  // simply do nothing (or raise an error)
            }
            element[0].href = 'javascript:alert("It works in 1.4.1, too!")';
        }
    };
 });

Usage:

<div ng-app="myApp">
    <a href="#foo" bookmarklet>click me</a>
</div>

I also created a fiddle demo to test it: http://jsfiddle.net/t0acdxcL/1/

ng-href directive not working

Solution provided in the below link helped me solve my problem.
https://stackoverflow.com/a/15769779/1029360

The chrome-extension: protocol needs to be whitelisted before use.

how to open unsafe URL's from angular8?

You have to use DomSanitizer#bypassSecurityTrustUrl:

class FooComponent {
  public constructor(private sanitizer: DomSanitizer) {}

  public getUrl(column: string) {
    return this.sanitizer.bypassSecurityTrustUrl(`change://problem/${column}`)
  }
}

and in the template:

<a [attr.href]="getUrl(element[column])">{{ element[column] }}</a>

Cannot open local file - Chrome: Not allowed to load local resource

We use Chrome a lot in the classroom and it is a must to working with local files.

What we have been using is "Web Server for Chrome". You start it up, choose the folder wishing to work with and go to URL (like 127.0.0.1:port you chose)

It is a simple server and cannot use PHP but for simple work, might be your solution:

https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb

---

Related Topics