Why dynamic links in React Native are opening the browser first? - react-native

I'm trying to communicate two React Native apps using Firebase Dynamic Links, only in Android.
When I execute openLink with the URL of the other, I see the browser for a second, and then it opens the other app well.
I don't want to see an intermediate browser before open the other app.
I'm having that issue from app A to B, and viceversa.
So, why is the browser opening first? And how can I configure the apps in order to not open the browser?

it's default behavior of android devices.
usually if any link supported by app and its set default to open link then it will open directly otherwise android system opens browser and based on Link URI scheme navigate to app.
there is one solution,
You can create module (intent activity) which will launch that app directly.
Steps to follow
pass data from js to native module and from that use Intent class, set data and start it.
this was for Android use case.

Related

How do I open the deep link in mobile browser rather than mobile app in react native

What I am trying to do is opening a deep link in mobile browse (Not in app). Deeplinking is all set up, all the links with specific domains are opening/navigating into app opened from any where else. Now here is a scenario that there are some particular links with same domain (I set up deeplinking for), I want to open that in browser because I don't have any view to show for that link in my app so I want them open in browser.
I have identified the links but when I opened these links via Linking.openUrl it navigates me to the app.
if (lowerUrl.includes(PostType.NO_DEEP_LINK)) {
Linking.openURL(lowerUrl);
return null;
}
Is there any method I can specify the Linking method to open url in mobile browser not in app although the url has a same domain that is setup for deep linkg.
Solution 1#
The best possible solution for that can be using android:pathPattern in android manifest. Basically you have to provide path pattern (a sort regex) to match the valid links.
Documentation for that can be found here.
https://developer.android.com/guide/topics/manifest/data-element
Solution # 2
One has to make RN Native Module and instead Linking.openURL(lowerUrl) to handle this kind of scenario.
To make browser native module one can take help from here.
This solution doesn't work with devices which lacks google play services like Kindle Fire, etc

Share Url from browser to React Native app

I want to share URLs from the browser to my React Native app and open them in the app, how can I do that?
This is called deep-linking, that your app launches and even does some actions depending on the called URL of your app. Many apps use it that's how you probably know it.
You can read about this and implement it.
Here is some articles and documentation about it:
https://reactnavigation.org/docs/deep-linking/
https://medium.com/react-native-training/deep-linking-your-react-native-app-d87c39a1ad5e

Native way to inform user there is a mobile app?

Often when viewing a website on a mobile device you'll get a notification that a mobile app is available, or if you already have the app downloaded you'll have the option to open the URL in the app.
Is there a native way to do this or are these notifications always custom?
When users click on a link or download a file and the suggestion pops up to open the respective app, that's called deep linking. iOS labels it as Universal Links and Android uses App Links.

How to get the URI scheme of any app for AppLinks/universal linking?

I need to open a third-party app from my react native mobile app. I understand that this is called universal linking on iOS and AppLink on Android.
I have done a lot of research for this, and I have been able to set up a link to the third party app on the app store. Now I just need to get my app to open up the app if the user has it installed. That requires the URI scheme of the other app, though.
My question is, how do I get the URI scheme to this third party app? Rather, how do I get the URI scheme of any app? I know the URI scheme of the twitter app is 'twitter://app', but the app I am trying to link to is way more niche than twitter or other popular apps, so there is no help for this sort of thing online.
Any tips?
Finding the URL scheme of an iOS app
Due to Apple's tendency for secrecy, it's not easy to find the URL scheme of an iOS app. But it can be done. Here's how I do it, using a Mac app called iMazing.
Launch iMazing, select a connected iOS device, click Apps:
In the footer of the window, click Manage Apps:
Select the app you're interested in , then select Export .IPA menu item. Note: You may need to download the app first.
The saved file will have the .ipa extension. Change the extension to .zip, and unzip the file. You now have a directory with the name matching the app's name.
Assuming "asana" is the app name, open the file "asana/Payload/asana.app/Info.plist" in a text editor, and search for a section that contains "CFBundleURLSchemes". Assuming the app contains CFBundleURLSchemes (they are optional), it should look something like this:
The URL scheme is in the <string>asana</string>, so the complete url scheme in this case is "asana://". Test that the URL launches the app by typing it into iOS Safari browser window. If it works, Safari should display an alert like this:
What About Apps Without CFBundleURLSchemes?
I haven't found a way to launch apps without CFBundleURLSchemes directly, but you can link to the app's page in the App Store, where the user can open the app with the Open button (or Get button if the app is not installed).
You will need to obtain the app page's URL from the App Store:
Open App Store, go to the app's page, click the share icon:
Click Copy Link:
The URL will look like this:
https://apps.apple.com/us/app/asana-organize-tasks-work/id489969512
Clicking on that link in Safari will bring up the app page in the App Store.
Maybe it is worth to start with some background:
There are various ways to deep link into an app, and it depends on the platform (iOS\Android\WindowsPhone...) and its version.
On iOS, up until version 9, the way to open an app was by using URI schemes, e.g. the one you added above: twitter://app. Each app declares the scheme that should be used. Therefore in order to deep link into the app you wish to open, you'll need to use the scheme that it declared. This is the same for Android until version 6.
Starting iOS9+, Apple introduced Universal Links as the method for deep linking. Here's some information: https://developer.apple.com/ios/universal-links/
In these versions, URI schemes won't longer work when using Safari browser (which is the iOS default browser) if the app is not installed. If the app is installed, however, URI schemes should allow opening the app, if everything is configured successfully. In Android there's a similar method called "AppLinks".
Having said this, the above information is for setting deep link for your app. I do not think that it is a common use case to open a third party app from your app - deep links are configured and used by the app owner (e.g. for publishing his\her app to engage users).

How to Launch/Open any other external app from hybrid app? [duplicate]

I have a requirement to open the native version of the hybrid app (.ipa/.apk/.appx) when the hybrid app is requested in a device browser.
I am able to detect the environment using WL.Client.getEnvironment(); method, if it is found to be Android/iPad, I want to launch the respective .apk/.ipa file in the device. Any help is appreciated.
Re-reading this question and the comments several times... I still do not understand the actual scenario... it'd be best to rephrase it.
Scenario: How to open an app from the web browser:
If you have added the following environments to your Worklight application:
Mobile Web
Android
iPhone
And when visiting the Mobile Web version of your app, you want to display a message like "For the full experience, open the full application by clicking here".
Then:
It is implied that the user already has the application installed.
If it is not installed, you need to take care of that somehow
The way to handle this scenario is to use URI schemas:
For Android: How to implement my very own URI scheme on Android
This means that after adding the custom URI schema to AndroidManifest.xml, you could then detect the device OS the Mobile Web app is currently running on and display a custom link: myapp://<the URI schema you've defined>. Tapping it will open the app installed on the device.
For iOS, in a similar fashion: https://coderwall.com/p/mtjaeq
Also see: http://wiki.akosma.com/IPhone_URL_Schemes
Alternate solution: If you are not sure if the app will be installed or not, then instead of using URI schemas you can always point to either Google Play or Apple App Store, to the app page; the user will then have either a "Open" or "Install" link.
Scenario: How to open an app from my own app
If you have a Worklight Hybrid application (Mobile Web is not a Hybrid application), and you want to open another application from within it, you can:
Use the same approach of URI schemas, or
Use Cordova plug-ins
I have created this Worklight 6.1.0 project to demonstrate:
Android - How to open, for example, the Android Settings app from your Worklight Hybrid app
iOS - How to check if Waze is installed and open it, and if it is not installed then to open Apple Maps instead.
See instructions.txt in the apps\test folder.
Are you asking that if the user via their device browser hits the webapp version of your app on the internet, the website will ask the user to fire up the native app on their device? kind of like what ebay does?
if that is what you want check out these pages
android:Launch custom android application from android browser
IOS:
iPhone - Open Application from Web Page