Open Links outside the App

It doesn’t work… I don’t understand why this is so difficult :S

1 Like

You can pass an additional argument to App.accessRule

Options
launchExternal Boolean
Set to true if the matching URL should be handled externally (e.g. phone app or email client on Android).

But this would mean whitelisting every URL you want to open externally.

1 Like

I’ve been trying to make it work with this, even when it doesn’t look like the best option, but it doesn’t make anything. The app simply doesn’t open the links…

1 Like
3 Likes

Finally it worked!

 meteor add cordova:org.apache.cordova.inappbrowser@0.5.4


<a href="#" onclick="window.open('http://www.facebook.com', '_system');">www.facebook.com</a>
8 Likes

Man, the amount of time I spent on finding a way to get this to work. Glad you did. Why is this so not-obvious?

2 Likes

It’s was a bit messy to find the answer…

I’m using this solution which works across the app on all relevant links.

Add org.apache.cordova.inappbrowser@0.5.4.

Add this code:

cordova.coffee:

Meteor.startup ->
  return unless Meteor.isCordova
  platform = device.platform.toLowerCase()

  # Handle click events for all external URLs
  $(document).on 'deviceready', ->
    $(document).on 'click', (e) ->
      $link = $(e.target).closest('a[href]')
      return unless $link.length > 0
      url = $link.attr('href')
      return unless Paths.isUrl(url)
      switch platform
        when 'ios'
          window.open url, '_system'
        when 'android'
          navigator.app.loadUrl url, {openExternal: true}
      e.preventDefault()
6 Likes

Thanks @aramk . works well

thanks for sharing! @aramk

@aramk Thanks your solution was good except for that I do not have Paths defined. What is Paths? A validation library you added. Can you give info about it? Instead of paths I am using regex to test for url like so:

isUrl = (s) ->
regexp = /(ftp|http|https)://(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(/|/([\w#!:.?+=&%@!-/]))?/
regexp.test(s)

Not sure if this is best, let me know

1 Like

When I try to run meteor run android-device with this particular version of InAppBrowser (default appears to be 1.0), I get the following exception:

   While running Cordova app for platform Android with options --device:
   Error: Command failed:
   /dev/hub/.meteor/local/cordova-build/platforms/android/cordova/run
   --device
   Note: Some input files use or override a deprecated API.
   Note: Recompile with -Xlint:deprecation for details.

   /devhub/.meteor/local/cordova-build/platforms/android/src/org/apache/cordova/inappbrowser/InAppBrowser.java:120:
   error: cannot find symbol
   || Config.isUrlWhiteListed(url)) {
   ^
   symbol:   method isUrlWhiteListed(String)
   location: class Config
   Note: Some input files use or override a deprecated API.
   Note: Recompile with -Xlint:deprecation for details.
   Note: Some input files use unchecked or unsafe operations.
   Note: Recompile with -Xlint:unchecked for details.
   1 error

   FAILURE: Build failed with an exception.

   * What went wrong:
   Execution failed for task ':compileDebugJava'.
   > Compilation failed; see the compiler error output for details.

   * Try:
   Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get
   more log output.

Any ideas?

Looks like if you use Version 1.0.1 (latest), this resolves the issue.

This is a prime target to become a neat little Atmosphere package… any offers? :smile:

Am I right in thinking that Hot Code Push wouldn’t work for this change, because it’s needing a new cordova package?

About Paths - seems to be a small package with various utilities: https://github.com/aramk/meteor-utility/blob/master/src/Paths.coffee

Does a simple check only:

  isUrl: function(path) {
    return Types.isString(path) && path.indexOf('://') >= 0;

As of now, with Meteor 1.3 and cordova-plugin-inappbrowser@1.3.0, the below line seems to be enough to open links on both Android and iOS.

window.open(url, ‘_system’);

1 Like

its still not working on my side

Did you add the App.accessRule to your mobile-config.js file? Something like:

App.accessRule('http://*', {type: 'intent'});
App.accessRule('https://*', {type: 'intent'});
1 Like

I added type navigation, then it worked.

What was the final solution of this @julianmwagner? Could you share what you have done to get this working?