Prefilling an SMS on Mobile Devices with the sms: Uri Scheme

Posted by Rick Strahl on West-Wind See other posts from West-Wind or by Rick Strahl
Published on Wed, 09 Oct 2013 17:04:00 GMT Indexed on 2013/10/17 21:55 UTC
Read the original article Hit count: 350

Filed under:
|
|

Popping up the native SMS app from a mobile HTML Web page is a nice feature that allows you to pre-fill info into a text for sending by a user of your mobile site. The syntax is a bit tricky due to some device inconsistencies (and quite a bit of wrong/incomplete info on the Web), but it's definitely something that's fairly easy to do.

In one of my Mobile HTML Web apps I need to share a current location via SMS. While browsing around a page I want to select a geo location, then share it by texting it to somebody. Basically I want to pre-fill an SMS message with some text, but no name or number, which instead will be filled in by the user.

What works

The syntax that seems to work fairly consistently except for iOS is this:

sms:phonenumber?body=message

For iOS instead of the ? use a ';' (because Apple is always right, standards be damned, right?):

sms:phonenumber;body=message

and that works to pop up a new SMS message on the mobile device. I've only marginally tested this with a few devices: an iPhone running iOS 6, an iPad running iOS 7, Windows Phone 8 and a Nexus S in the Android Emulator. All four devices managed to pop up the SMS with the data prefilled.

You can use this in a link:

<a href="sms:1-111-1111;body=I made it!">Send location via SMS</a>

or you can set it on the window.location in JavaScript:

window.location ="sms:1-111-1111;body=" + encodeURIComponent("I made it!");

to make the window pop up directly from code. Notice that the content should be URL encoded - HTML links automatically encode, but when you assign the URL directly in code the text value should be encoded.

Body only

I suspect in most applications you won't know who to text, so you only want to fill the text body, not the number. That works as you'd expect by just leaving out the number - here's what the URLs look like in that case:

sms:?body=message

For iOS same thing except with the ;

sms:;body=message

Here's an example of the code I use to set up the SMS:

var ua = navigator.userAgent.toLowerCase();
var url;
        
if (ua.indexOf("iphone") > -1 || ua.indexOf("ipad") > -1)
    url = "sms:;body=" + encodeURIComponent("I'm at " + mapUrl + " @ " + pos.Address);
else
    url = "sms:?body=" + encodeURIComponent("I'm at " + mapUrl + " @ " + pos.Address);

location.href = url;

and that also works for all the devices mentioned above.

It's pretty cool that URL schemes exist to access device functionality and the SMS one will come in pretty handy for a number of things. Now if only all of the URI schemes were a bit more consistent (damn you Apple!) across devices...

© Rick Strahl, West Wind Technologies, 2005-2013
Posted in IOS  JavaScript  HTML5  

© West-Wind or respective owner

Related posts about ios

Related posts about JavaScript