Angular Js and Trigger.io - Cannot find Android link that runs on iOS

Question

I am using AngularJS with Trigger.io to develop a mobile application for iOS and Android.

When I try to open a link that looks like this:

<a ng-href="#/offers/{{featured_offer.Id}}"></a> 

It works fine on iOS, but on Android I get this message in the trigger console, and the link does not translate to:

 [WARNING] Attempted to open a URL which could not be handled: unsafe:content://io.trigger.forge722b6464a0e211e2ba9d12313d00dc45/src/index.html#/offers/8 

How can I make this work in Android the same as in iOS?

Answer 1

It looks like Angular is adding unsafe: for URL schemes that it does not recognize, I think you want to include something like:

 app.config(function($compileProvider){ $compileProvider.urlSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel|content):/); }); 

What adds content: to accepted URL schemes.

Answer 2

I had the same problem, in particular, with trying to display img from the src file returned by forge.file.getImage. Angular adds insecure: to the content: the prefix of the local url img, and as connorhd said, you need to add the content: to the url whitelist.

Please note that the compileProvider API has changed with the latest versions of Angular, so I will comment here if anyone else finds an updated version of this workaround useful.

 app.config(['$compileProvider', function($compileProvider) { $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel|content|blob):|data:image|/); // note: you'll also have to do imgSrcSanitizationWhitelist if you want to use general links as well as ng-src on images. }]); 

Answer 3

I had this problem too, just add sanitizer to your config.xml

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