Failed to launch 'URL' because the scheme does not have a registered handler
Solution 1
It seems it's not possible to handle it if using href
property directly.
However, if you move this logic inside your components there are several options
Inside application:
You can check the app availability using this plugin i.e.
let app;
if (this.platform.is('ios')) {
app = 'twitter://';
} else if (this.platform.is('android')) {
app = 'com.twitter.android';
}
this.appAvailability.check(app)
.then(
(yes: boolean) => console.log(app + ' is available'),
(no: boolean) => console.log(app + ' is NOT available')
);
Inside browser:
-
Use timeout fallback i.e.
<!-- Deep link URL for existing users with app already installed on their device --> window.location = 'yourapp://app.com/?screen=xxxxx'; <!-- Download URL (TUNE link) for new users to download the app --> setTimeout("window.location = 'http://hastrk.com/serve?action=click&publisher_id=1&site_id=2';", 1000);
Actually, this is the way we used in one of our web application and it worked successfully.
-
Use deep links handler library which allows you to work with deeplinks like this
<a href ="..." Fallback (and unsupported OSs) data-app ="..." Deep link (cross-OS) data-app-[os] ="..." Deep link (OS-specific) data-store-[os]="..."> Store ID (OS-specific)
I didn't use it before so can't tell anything special regarding it
Solution 2
I use this to check if the app is installed or not.
"intent://scan/#Intent;scheme=whatsapp://send?#text=text=some%20text;S.browser_fallback_url=https://play.google.com/store/apps/details?id=com.whatsapp;end"
Related videos on Youtube
Nico
Updated on June 04, 2022Comments
-
Nico almost 2 years
i'm trying to build a social share component with angular 11 and ionic 5. I'm using an anchor tag to call href="whatsapp://send?#text=some%20text". This works fine on devices with WhatsApp installed, but i only get the following error in the browser console on devices without WhatsApp installed:
Failed to launch 'whatsapp://send?#text=text=some%20text' because the scheme does not have a registered handler.
How can i catch this error to show the user a nice message like "Sorry, you have no WhatsApp installed"
-
Nico about 3 yearsUnfortunately, this does not work if the application is run in a browser. A working example would be Amazon: Product page -> DevTools -> select mobile device -> reload Page -> share -> whatsapp
-
Sergey Mell about 3 yearsYeah, you're right. appAvailability won't work in the browser. My fault. Let me research a bit, maybe I find a solution
-
Sergey Mell about 3 years@Nico, please check the updated version of my answer where I added pure browser solutions. Hope it helps
-
Nico about 3 yearsappAvailability can only be used with native apps on iOS and Android. I think over time that it comes down to a workaround, e.g. a timer that assumes after a certain time that an action would have happened, otherwise the app is probably not installed on the device or something like that
-
Sergey Mell about 3 yearsI've told in my previous comment that I was wrong about
appAvailability
. In my last answer update I've added pure browser solutions. Did you see thesetTimeout
solution for example?