Problem opening the SMS app on iOS via Ionic

ionic-v1
1

Got a strange problem with my app. I have a view where the user can tap any one of three buttons to either send an email to a person, send a text or call them. The links are:

<a href="mailto:{{ person.email }}">Send Email</a>
<a href="sms:{{ person.phonenumber }}">Send SMS</a>
<a href="tel:{{ person.phonenumber }}">Call</a>

The Email and Call links work perfectly. However, when I click to send an SMS, instead of opening the SMS app, I am noticing the following error in XCode:

Failed to load webpage with error: The URL can’t be shown

I have edited the config.xml file to include:

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

so I am stumped as to what else I can do?

2 Likes
2

Bump for todays crowd… no one else experienced an issue like this ??

I should also clarify that I made a mistake when retyping in my lines of code above. The href is actually ng-href because of the Angular variables used within. i.e

<a ng-href="mailto:{{ person.email }}">Send Email</a>
<a ng-href="sms:{{ person.phonenumber }}">Send SMS</a>
<a ng-href="tel:{{ person.phonenumber }}">Call</a>
3

Which iOS version do you have?

i recognized that in iOS <6 this will not work.

An alternative is the cordova social sharing plugin -> there you can share stuff via standard email, sms, … but mostly all installed chatting apps.

4

Using an iPhone 6 with iOS 8.1.2 to test…

I was debating using the SMS pluging, but really all I wanted my user to do was press a button to load up the SMS app with the recipients number all preloaded, so that they could type their own message in there. Don’t need to auto send in the background or anything, so I thought the plugin would be overkill.

Having said that, can the plugin just open the SMS app and wait for the user to do whatever they want in there?

5

i think so. you can just pass empty body that should leave the sms-text blank.
Strange i tested this with my android… and i thought this would work there too… but nothing.

1 Like
6

Bumping again for the evening crowd - hopefully someone out there can shed some light on this peculiarity. If @bengetler is reporting the same thing in Android, then could this be an issue with Cordova? Any other security settings we might have missed in config.xml perhaps?

7

I’m experiencing this issue too. Mailto and Tel are working fine. iOS 8.1.3 (latest as of this post). Using ng-href, no telephone number, and pre-filled body param.

<a ng-href="sms://&body={{referralMessageBody}}" class="button button-light icon ion-chatbox-working"></a>

2015-02-16 11:51:03.020 MyApp[651:183020] Failed to load webpage with error: The URL can’t be shown

Hope someone can help!

8

Yes, I’m having no problems with <a href="sms:"> but I’d prefer to prefill the body.

11

Same problem here. ios 8.1.2.

config.xml file changed to include:

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

xcode html file includes:

<a ng-href="sms:{{user.phonel}}" class="button  back-8 ">

Any known solutions @erictj @CyberFerret @bengtler ?

12

Couldn’t get any answers about this I am afraid - nothing in the Apple discussion area, nor StackOverflow about this.

I ended up using the Cordova SMS plugin to activate the SMS app on both platforms, which works for me now even though it is a bit of overkill for what I want.

13

I’ve managed to get the ios messaging app to display, however it will not pre fill the phone number.

To do this i followed this tutorial: Sms display

I then changed the $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|file|tel):/);

to

$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|file|sms):/);

note the end change from tel to sms.

Anybody know how to pre-fill the ios messaging app with a phone number?

1 Like
14

I caved and used the Cordova Social Sharing plugin.

cordova plugin add https://github.com/EddyVerbruggen/SocialSharing-PhoneGap-Plugin.git

Add dependency in controller: $cordovaSocialSharing

    $scope.shareSms = function() {
      $cordovaSocialSharing
      .shareViaSMS("message", "phonenumber")
      .then(function(result) {
       
      }, function(err) {
        
      });
    }

Call shareSms() from template on ng-click.

1 Like
15

Thanks for that! However I managed to get it to work without adding the plugin.

16

hi @geewhizapps can you pls show how u get it work iwthout sms plugin, im having same problem here pls

17

Worked for me !!
Just modified the regex to /^\s*(https?|file|sms)?:?/ to handle relative urls

18

I got this to work without a plugin. I was able to modify slightly an answer from this stackoverflow post: http://stackoverflow.com/questions/15606751/angular-changes-urls-to-unsafe-in-extension-page

I have this code in my config.js:

.config( [
    '$compileProvider',
    function( $compileProvider )
    {   
        $compileProvider.aHrefSanitizationWhitelist(/^\s*(sms|tel|mailto):/);
        // Angular before v1.2 uses $compileProvider.urlSanitizationWhitelist(...)
    }
]);

and then this in my config.xml:

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

And it totally works, at least on android, haven’t tested ios yet.

Good Luck!

2 Likes
19

I want code send auto SMS??? How do? Please help me

1 Like