How to get data from browser like url, its params etc back to expo app and vice versa? - react-native

So, I have been looking for a way as how to pass data between expo app and the web browser which opens as a modal within the app (not WebView). Like how to pass some data as params to the browser, or how to get data back from browser to the expo app
I have been looking through the Linking and Deep Linking documentation but they are not much helpful, please help

Related

React Native send email with link to web app or mobile app

I am trying to implement deep linking into this app. The app is a React Native Expo app, and is served on web, iOS and Android. There are a bunch of things we want to achieve with this i.e. link to specific things in the app such as certain messages etc. But currently my primary focus is just to navigate to general screens like 'Home', 'Messages', 'Login' etc.
I have been testing and so far, I can enter the URIs such as exp://host:port/--/login and they work as expected.
However, I know and understand that this will not work in a web browser on my laptop for example.
So my question is, how do I send an email to a user let's say after they have verified their account, prompting them to login, with a link that will for one, take them to the web app if they are on desktop, and two open the mobile app if they have it installed on their phone?
And just as an example, let's imagine my deep link URI is myapp://login
Thanks for any help.
EDIT
After looking around some more, I am deciding to consider the possibility of linking to the web app, and upon the web app loading, linking to the mobile app if they have it installed.
Given this, what is the best way to handle this?
You can follow one of the next approaches.
Validate the request origin and based on that generate the link for
an specific platform.
Generate as much links as platform are currently serving you app.
Like: Link to iOS, Link to Android and Link To web
You can design image buttons for each one to make it prettier

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

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

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.

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

Using Branch links to deeplink to unpublished app

I'm working as a web developer for a start-up that has a andriod app prototype. I'm not an app developer ( still learning) so I'm a little unsure how to approach this.
I wanted to deeplink the app to the webpage. I came across this solution called Branch.io . It looks like exactly what we need but I'm not sure how to link it with an unpublished app. Maybe I'm missing something. Any advice would be greatly appreciated.
The Branch service actually doesn't depend on the App or Play Store at all. The link will first try to open up the app, but fallback to the store pages if not installed. You can override this fallback to any website, and the links will still function as usual.
To test an app not in the Play Store, first choose 'Custom URL' in the Link Settings dashboard, and fill in the page you'd like to send users when the app is not installed. It's common for people to send users to either their home page or TestFlight app.
Then, to test the deep linking through install and download tracking, just do the following:
Create a Branch link
Click it on your phone or on simulator and wait to be redirected
Run the app from Android Studio/Eclipse
Here are some more testing considerations. Happy linking.