How to redirect users from a desktop website to a mobile website using Nginx

As a quick note, I used to have this website (alvinalexander.com) configured to have both a desktop version and a mobile version. I did this by using Nginx to detect mobile devices and redirect the mobile users from the alvinalexander.com URL to the m.alvinalexander.com URL.

The Nginx mobile redirect configuration

The relevant part of my Nginx configuration is shown here:

#-----------------------------
# alvinalexander.com (desktop)
#-----------------------------

server {
    server_name  alvinalexander.com;
    listen       80;

    #----- redirect to mobile check (starts) -----#
    set $mobile_rewrite do_not_perform;

    # this regex string is actually much longer to match more mobile devices
    if ($http_user_agent ~* "|android|ip(ad|hone|od)|kindle") {
        set $mobile_rewrite perform;
    }

    if ($mobile_rewrite = perform) {
        rewrite ^ http://m.alvinalexander.com$request_uri? redirect;
        break;
    }
    #----- redirect to mobile check (ends) -----#

    include /etc/nginx/aa-common.conf;

}

#------------------------------
# m.alvinalexander.com (mobile)
#------------------------------

server {
    server_name  m.alvinalexander.com;
    listen       80;
    include /etc/nginx/aa-common.conf;
}

For the purposes of this discussion, the important lines are the ones that start with the “redirect to mobile check (starts)” comment. Those lines of code test the http_user_agent to set the mobile_rewrite variable, which is then used in the if clause to redirect users to the mobile site when their user agent appears to be for a mobile device.

The include statements in both server sections let me use the same base Nginx configuration for both the desktop and mobile websites. Because this site has some very old URLs, I use redirects statement to redirect browsers to the new URLs.

In summary, if you needed to see how to redirect users from a desktop website to a mobile website using Nginx, I hope this information has been helpful.

Add new comment

Anonymous format

  • Allowed HTML tags: <em> <strong> <cite> <code> <ul type> <ol start type> <li> <pre>
  • Lines and paragraphs break automatically.