Redirect QR Code Based on Mobile Device

By on 3-17-2013 in Articles and Ramblings, How to do Stuff

Redirect QR Code Based on Mobile Device

One of the most useful workflows I developed when I was a production manager at an ad agency was to have a qr code redirect to a different web address based on the type of mobile device used. This was useful because we had a mobile app for each device, and I thought it would be a great user experience to have the qr code send the user directly to the appropriate app download page based on their device. This method uses a javascript snippet and can also be used to redirect without a qr code if needed.

Here are the steps needed to develop the proper redirect:

1. Create a webpage. For our sample, we’re going to call this razsattic.com/qr_test.html

2. Create a QR code and have it link to the new webpage you created.

3. Place this bit of javascript within the <header> section:

<SCRIPT LANGUAGE=”JavaScript”><!–

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf(“android”) > -1; //&& ua.indexOf(“mobile”);
if(isAndroid) {

window.location = ‘http://www.nintendo.com';
}

if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) {
if (document.cookie.indexOf(“iphone_redirect=false”) == -1) window.location = “http://www.aol.com”;
}

if((navigator.userAgent.match(/iPad/i)) || (navigator.userAgent.match(/iPad/i))) {
if (document.cookie.indexOf(“ipad_redirect=false”) == -1) window.location = “http://www.microsoft.com”;
}

//–></SCRIPT>

For this sample, if you scan the QR code above with an android device, you will be redirected to nintendo.com. An iphone or ipod will take you to aol.com, and if you use an ipad, you will be taken to microsoft.com.

Please note that it has been a while since I executed this code, so it hasn’t been properly tested. I’m a total newb to javascript so please be sure to properly test before sending this out into the real world. There are some modifications I would want to this. I would love to add a piece of code that would send a user to another address if they don’t have either of these devices. I had it at one point, just don’t recall and haven’t had to use this in a few years. Still, this article should help point you in the right direction. Please feel free to comment with any suggestions.

If you’d like to know how to execute a redirect of a QR code in order to change where the QR Code points to, check out my article: http://razsattic.com/2013/redirect-qr-code

good luck.


Fatal error: Uncaught Exception: 12: REST API is deprecated for versions v2.1 and higher (12) thrown in /home/content/47/7469547/html/wp-content/plugins/seo-facebook-comments/facebook/base_facebook.php on line 1273