Link from app to site

help
1

I don’t know if I’m missing something but I have a link on my Android App, whenever I click on the link. It does not open it.

Ps: link is referenced with an element.

Please could someone help me understand what am I doing wrong?

Thank you so much,
Laurent Kouassi,

2

I feel there is far too little info. However, let’s start from here - did you add this to your Cordova Android App: https://github.com/apache/cordova-plugin-inappbrowser ?

1 Like
3

Thank you so much @paulishca for your help but no, I have not added it yet. Could you please send me the installation instructions?

Starting with meteor add.

Thank you so much.

4
  1. External link like http(s)://www… or deep linking for mobile apps.

I’ll give you a custom (improved) version

meteor add cordova:cordova-plugin-inappbrowser@https://github.com/apache/cordova-plugin-inappbrowser.git#388e3f6ae74b7c59fee43e360427ab73325f9a77

In your client startup you add these lines:

if (Meteor.isCordova) {
   window.open = cordova.InAppBrowser.open
}

Then you can create a handler similar to this:

import { Meteor } from 'meteor/meteor'

const handleOpenUrl = (e, url) => {
  if (e) { e.preventDefault() }
  if (Meteor.isCordova && url) {
    const target = '_blank'
    const options = 'location=no,clearcache=yes,presentationstyle=formsheet,allowInlineMediaPlayback=yes,shouldPauseOnSuspend=yes,' +
      'closebuttoncaption=Close,toolbarcolor=#fafafa,hidenavigationbuttons=yes,hardwareback=no,closebuttoncolor=#666666,' +
      'disallowoverscroll=yes'
    cordova.InAppBrowser.open(url, target, options)
  }
}

export { handleOpenUrl }

Then use above function where needed like so:

// example with actionsheet:

 if (tag) {
            window.plugins.actionsheet.show(actionsOptions, i => {
              if (i === 1) { console.log('do a query in activitree') }
              if (i === 2) { console.log('start followign this tag, add a record to follows') }
              if (i === 3) { handleOpenUrl(null, `https://instagram.com/explore/tags/${tag}`) } // this one
              if (i === 4) { this.setState({ infoModalOpen: true }) }
            })
          }

or like so:

<span onClick={e => handleOpenUrl(e, url)}>Dari-Dada</span>
  1. Internal link in the app (routing). You need to use a (the) router in order to navigate inside the app. Ex. for React you would use something like Home where Link is imported from react DOM or router DOM.
1 Like
5

Thank you so much @paulishca. That was really helpful.
Love you hahaha.

1 Like