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.
The syntax that seems to work fairly consistently except for iOS is this:
For iOS instead of the ? use a ';' (because Apple is always right, standards be damned, right?):
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>
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.
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:
For iOS same thing except with the ;
Here's an example of the code I use to set up the SMS:
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf("iphone") > -1 || ua.indexOf("ipad") > -1)
url = "sms:;body=" + encodeURIComponent("I'm at " + mapUrl + " @ " + pos.Address);
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...
I'll be at DevIntersection in Vegas this fall giving sessions on ASP.NET Core with Angular and Localization. Thinking of coming? Use discount code STRAHL and save a few bucks. If you do be sure to stop by and say hello!
Other Posts you might also like