Expo AuthSession: WebBrowser.dismissBrowser is not available on android - react-native

Having the error running on android:
The method or property WebBrowser.dismissBrowser is not available on
android, are you sure you've linked all the native dependencies
properly?]
- node_modules/#babel/runtime/helpers/construct.js:30:26 in _construct
- node_modules/#babel/runtime/helpers/wrapNativeSuper.js:26:23 in Wrapper
- ... 19 more stack frames from framework internals
I can open a browser. Once inside the browser if I quit the browser and went back to the application, the above message show up.
I tried look at WebBrowser from expo documentation
WebBrowser.openAuthSessionAsync(url, redirectUrl)
Opens the url with Safari in a modal on iOS using SFAuthenticationSession. The user will be asked whether to allow the app to authenticate using the given url. Unavailable on Android.
What does the line mean? does that mean android don't work etc.
The user will be asked whether to allow the app to authenticate using
the given url. Unavailable on Android.

Related

React Native: Cognito federated auth issue on Android TV

AWS Cognito Federated sign in with Google setup correctly and it works perfectly on Android devices (phones, tablets). But on Android TV Web Browsers can't redirect to custom url scheme (web browsers don't understand that the app should be opened). The error says "can't open scheme myapp://oauth/?iod=..." with the error code Net::ERR_UNKNOWN_URL_SCHEME.
React Native version is 0.66, with not the latest aws-amplify, but the issue mainly related to the behavior that browser doesn't open the app with custom url scheme.
Does anybody encountered such an issue and if yes, then what solution could be here?
Appreciate your help.
I've tried to use redirectSignIn url as App link instead of custom url scheme, but that didn't work (when you open app link from another app android opens proper app, but if redirecting/opening within the browser, then it redirects to the web page).

Branchio Universal Deeplink redirecting to safari and shows popup to launch the application even app is installed in iOS 13.3.1

Even though the Application is installed in the iPhone, tapping Branchio universal deep-link redirecting to safari and shows a popup to launch the application.
Expected: if the application is already installed, tapping deep link should launch the application.
Pre- requests:
OS: iPhone iOS 13.3.1
Release build in Appcenter
Set custom URL to https://install.appcenter.ms/app (Appcenter)
Generate the Universal deeplink
Steps to reproduce:
Generate the Universal deep-link
Using the deep-link install the application
Again Tap on the same deep-link will redirect to Safari and popup alert with CANCEL and OPEN options
Tap OPEN in safari to launch the application
This is an expected behaviour where Apple prompts the user first time if to open the app. Only if universal links are implemented, it does not ask for the second time. Our AASA validator tool (https://branch.io/resources/aasa-validator/) shows the AASA file to validated correctly but while testing on the install page of your redirected website, it is showing a 404 error. So, we are unable to replicate this on our end to check further.
Could you please share your app store link so as to help us out here.
Also, would request to check our documentation here ( https://help.branch.io/developers-hub/docs/ios-troubleshooting#section-validate-if-aasa-file-successfully-downloaded ) so as to confirm if the device is receiving the generated AASA files. This is a known issue with Apple for iOS 13.x+ where the AASA files do not get ingested into the device and causes the link redirection to show a prompt or a fail.

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

Progressive Web App: Error Accessing navigator.mediaDevices.getUserMedia?

My app accesses the camera for purposes of webrtc, and works correctly.
I'm using pwacompat from Google Labs to add pwa features to my web app.
When running the app as a pwa, everything works fine until I access the camera. Then I get this console.log error:
getUserMedia failedObject {type: "error", msg: "undefined is not an object (evaluating 'navigat…"}
getUserMedia failed type: error msg: undefined is not an object (evaluating 'navigator.mediaDevices.getUserMedia')
What am I missing?
Update - 19/11/2020
WKWebView can use getUserMedia in iOS 14.3 beta 1.
https://bugs.webkit.org/show_bug.cgi?id=208667
https://bugs.chromium.org/p/chromium/issues/detail?id=752458
Update - 14/09/2019
There are changes to Safari on iOS 13 & Safari 13: https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes
SFSafariViewController has gained getUserMedia functionality (!!!, however I need to confirm this, please see below for reports of it working)
https://bugs.webkit.org/show_bug.cgi?id=183201
However WKWebView does not seem to gain getUserMedia functionality:
https://bugs.chromium.org/p/chromium/issues/detail?id=752458
https://bugs.webkit.org/show_bug.cgi?id=185448
iOS 13 and Safari 13 release notes:
https://developer.apple.com/documentation/ios_ipados_release_notes/ios_13_release_notes
https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes
Edit
In short: A PWA or any website being used on iOS outside of the native Safari app will not be allowed access to getUserMedia as Apple is deliberately blocking access for "Security concerns". This includes any websites saved to the homescreen and/or viewed inside another application such as Facebook. The same restrictions apply to Android however on Android the app developer can ask for Camera permissions and get around this. (This means if you are a website developer and you need camera functionality, you will need to ask Facebook, etc, to rebuild their app to allow this on Android).
See their bug tracker here: http://www.openradar.me/33571214 and https://forums.developer.apple.com/thread/88052
From web based Safari experiences to Native Android, etc. I make crossplatform Apps in web and native for a living. There are several potential problems you will encounter with getUserMedia. To workout what is causing potential problems you should follow this list in order to create a successful application.
Your problem is specifically 1. because you are not successfully querying the API. Nevertheless the MediaCapture from getUserMedia should fail because after fixing 1. you will encounter 2. and 3.
API Polyfil - Always make sure you include the latest getUserMedia adapter to stop any cross-platform inconsistencies in the getUserMedia API. Some browsers might use the old getUserMedia API (via 'navigator.getUserMedia) and have not been updated (to use navigator.mediaDevices.getUserMedia). You should also check this link for other needed polyfills.
Support - Check CanIUse for getUserMedia support for your target audience and make sure you have the necessary fallbacks. Your fallback for if (navigator && navigator.mediaDevices && navigator.mediaDevices.getUserMedia) { return true; } else return false; returns false, and if getUserMedia throws and error ideally should be the same.
Permissions - Even though you include pwacompat it does not mean the browser window has the permissions to access the camera. This is because not all browsers are equal! iOS 11 allows getUserMedia access inside of the native Safari app only. However you cannot access getUserMedia on iOS 11 WKWebView or UIWebViews. When you save an app to the homepage it is hosted inside a WKWebView. Thus an experience which works inside of Safari will not work when saved to the homescreen or inside another application. Confusing eh?..! Thus if you want your experience to work you need to tell the user when they open upside another app that they must open the website in safari for real-time camera access. There is no way around this. On Android an app maker can override this permission and allow access to getUserMedia. If you use macOS or Windows you need to make sure the browser shell also has getUserMedia compatibility (e.g. Edge+, Chrome, Firefox, etc)
Security - HTTPS websites can only access the camera (unless on localhost). Check the location prototcol '(location.protocol === 'https:') ? true : false;' to see if you are allowed to get a successful MediaCapture request
The following is a test link I use for platform support:
https://github.com/marcusbelcher/wasm-asm-camera-webgl-test
In my GitHub there are also Android and React-native getUserMedia solutions

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