Mobile Web Development with Tunnlr


If you are into mobile web development, you may want to check out Tunnlr. What is Tunnlr? If you are into Rails or Facebook development, you may already be hipped to Tunnlr. But for those of us who weren’t, it is a port forwarding service. Why would you want to use it for mobile web development? Well, Tunnlr allows you to make your unpublished website visible publicly temporarily. Why would you want to do that? Here are a few reasons why:


  1. To test show your site to someone who is remote
  2. To test your site at 3G speed
  3. To interactively debug your site from a phone

Tunnlr will assign you a publicly visible URL, which points to your dev box. This can be a great way to allow others to see it. Simply send your Tunnlr URL to people you would like to see your site.  Tunnlr isn’t free, but it is available at the reasonable fee of $5 a month after a 90 day trial.

How Does It Work?

To quote the Tunnlr website:

Tunnlr uses SSH remote tunneling. It securely connects a port on your local machine to an open port on our public server. Once you start your Tunnlr client, the web server on your local machine will be available to the rest of the world through your special Tunnlr URL.

Tunnlr uses public-key cryptography to secure the communication between their server and your machine. So you will need to generate a public/private key pair. I recommend creating it before getting started.

Create a Public/Private Key Pair
  • Check the ssh directory of your machine to be sure that you don’t already have a key pair
    • from Terminal, ls ~/.ssh
    • You will be looking for two identically named files, one without an extension and the other with a .pub extension, for example: identity and identity.pub
    • In the above example, identity.pub would be your public key - this is the key that you will give to Tunnlr. The other is your private key. NEVER GIVE IT OUT.
  • If you need to create a key pair:
    • ssh-keygen -t dsa
    • You will be prompted for a key name, if you don’t enter one, it will use, id_dsa, by default. You also be asked for a passphrase, you can simply press enter and skip entering. Two files will be created: id_dsa and id_dsa.pub. Your public key will be id_dsa.pub.
  • Copy the public key to the clipboard:
    • cat id_dsa.pub | pbcopy

Sign Up
  • Go to http://tunnlr.com and click the “Sign Up” tab
  • Click the “Single” link and fill out the form
  • You will be sent a verification email, once you respond you will have access to Tunnlr via your own URL. Be sure to use this URL when you login.
  • Go to your Tunnlr URL address and log in
  • Your home page will show your Tunnlr URL
  • Copy your public key into the text area labelled, “Authorized Keys”
  • Click the “Save” button
  • Near the bottom of the web page, click the link “How do I manually start a tunnel? (+)”
  • The ssh command line will be displayed, copy it for the next part

Start the Tunnel


ssh is the Mac’s built-in implementation of OpenSSH. There is no graphical interface for ssh, so you will have to use terminal to configure it. The exact command line for your tunnel may be different than mine, so be sure to copy the command line exactly as it appeared on screen from the previous section. In my case, I want Tunnlr to talk to my Mac’s web server, so I use port 80.




Working with a PC Virtual Machine

Most of my backend servers use Microsoft’s ASP.NET MVC framework. On my Mac, I use Parallels 7 to create a PC virtual machine. In order to talk to the PC virtual machine, you just need to use its ip address instead of the four zeros above. My test website is running on port 8200 on ip address 192.168.1.91, so the command line is:

When you are through testing your website just stop ssh by typing ctrl-C. If you would like to be more secure you can kill the tunnel on Tunnlr by simply clicking the “Kill Old Tunnels” button below Tools on the right hand side.

Summary

If everything worked-out right you should be able to hit your website from any device connected to the Internet. Remember the tunnel is only open while ssh is running on your Mac. If you close the terminal or control-C the program, the connection is terminated.


References

http://tunnlr.com

Popular Posts