mailto: links not opening mail app on Android in cordova app

Question

This is driving me crazy. I'm working on a Ionic app (Cordova, Angular etc). I have a contact us link which contains a mailto: href

href="mailto:info@somedomain.net?subject=my%20App"

I've read countless posts on SO that say you have to remove

<access origin="*"/>

from the config.xml in the project root and replace it with:

<access origin="mailto:*" launch-external="true" />

Which I've done. When I run ionic build it gets added to the config.xml in platforms/android/res/xml . But no matter what I do the link doesn't open the mail app on any Android simulator (even when email is configured in the simulator).

Sadly I don't have a device to test on - so is this just a emulator thing or am I missing something?

Answer 1

You must install the cordova plugin whitelist :

cordova plugin add cordova-plugin-whitelist

or if you want to save the reference to your config.xml file:

cordova plugin add cordova-plugin-whitelist --save

and that you have to add the intent to your config.xml file:

<allow-intent href="mailto:*" />

You can find more info here .

Answer 2

I just solved this thanks to the responses & articles above. I'm not sure what has or hasn't changed since the above postings, but for the reference of others; I now have http://, https://, tel:, & mailto: working with only the inappbrowser plugin installed and no manual edits to config.xml needed. I did everything mentioned above & it still wasn't working, so I started fiddling and found that I the window.open() call requires the second parameter of "_system" to work correctly (it tried to use the browser and "navigate" to http://mailto:xxx... without the "_system" flag).

However, for curiousity's sake, I uninstalled the whitelist plugin and removed the manual edits in config.xml and it still works.

Notes:

-I don't remember all the variations I tried, but onclick couldn't access the Ionic/Angular/Cordova scope(s), so I stuck with ng-click.

-I did not / have not tried using href="..." with any of the options. (If I remember, I'll test them and update this to reflec my results.)

So, with only the cordova-plugin-inappbrowser installed and no config.xml edits, here are my working / tested solutions:

ng-click="window.open('http://somesite.com', '_system')"
ng-click="window.open('https://google.com', '_system')"
ng-click="window.open('tel:(123) 345-4567')"
ng-click="window.open('mailto:email@example.com', '_system')"

Tested 9/20/2016 Using:

HTC One M8, android 6 ,cordova v6.3.1, cordova-plugin-inappbrowser v1.5.0, ionic v2.0.0, jdk1.8.0_101, android SDKs 21, 23, & 24 installed

Answer 3

尝试这个：

window.location.href = "mailto:your@ema.il?subject=Works on iOS too";

Answer 4

如果用“是”替换“true”怎么办...我在我的应用程序中使用它并且它有效。

<access origin="tel:*" launch-external="yes"/>

Answer 5

Ran into this today and noticed something that affected mailto, but not tel, links:

In addition to adding the intent to the cordova config as described by dave's answer

<allow-intent href="mailto:*" />

I also had to allow mailto links in the csp header of my page

<meta http-equiv="Content-Security-Policy" content="default-src 'self' mailto:*">

Didn't see any documentation around this behaviour of CSP headers.

Answer 6

Altering Cordova's WhiteListPlugin in config.xml did not work for me -- <access >, `. I tried many combinations, including those above. Doesn't mean these won't work necessarily, just for my setup it doesn't. (Building for Browser, Android, and iOS)

However, using the Cordova InAppBrowser Plugin worked:

As mentioned above, use the inAppBrowser plugin and set the target to _system.

This by passes the issues I was seeing in iOS with unsupported url , and launches the native systems web browser (ie, Does not rely on WhiteListPlugin to allow the URL call).

Hope this helps.

Cordova version 6.3.1.

Answer 7

Just in addition to use Cordova's WhiteListPlugin ;

It worked for me in this way: in config.xml

<access origin="*"/>
<access origin="mailto:*" launch-external="true" />
<allow-intent href="mailto:*" launch-external="yes"/>

And specially for ios add :

<platform name="ios">
    <allow-navigation href="mailto:*" launch-external="yes"/>    
    ...
 <platform name="ios">