Posted on by & filed under Content - Highlights and Reviews, Mobile Development.

If you’ve been using Adobe Shadow to preview your local content, you may have run into a sticky issue – namely that if you’re using Virtual Hosts to serve up private local content, you can’t use Shadow to preview your content on your devices without modifying your webserver configuration. Let’s take a look at this problem and how you can get around it.

You might be working on some designs for and several other domains on your own machine, so you’ve configured your Apache config file to know that if it sees an incoming request for, it should serve content from a specific folder. Alternately, you might be working on a design for a site that you refer to by a fake subdomain. Then you can add an entry to your hosts file so that when you enter the domain in your browser, you see your local content instead of what is available to the public.

When you try to use Adobe Shadow to preview this content, your devices don’t have access to your hosts file, so they go out to their respective DNS servers to try and resolve the domain. You can work around the problem if you set up your devices to proxy through the machine that hosts your webserver, or by not using virtual hosts in the first place, but it seems like there should be an easier way to deal with this, given how hard it is to update the hosts files on your devices.

After playing around with Node.js for a while, I thought you could likely solve the problem by pulling together a really simple reverse proxy server you could access using Shadow. If it worked, it would be a way to handle the hosts file issue. A quick search gave me something to build on, namely this reverse proxy server written for Node.js. I decided to give it a try.

I started by configuring my Apache to turn on virtual hosts, and in the virtual hosts config file I set up localhost and some.private.thing.local:

Next I added a some.private.thing.local to my hosts file:

After I set up some rudimentary content for the virtual hosts, I modified Nodejs-proxy. Specifically, I wanted to pass in the destination domain at the command line, and replace the proxy host in the headers of the request before it gets passed along:

Just by adding that change, I was able to test the basic local content. I launched the script, passing in the domain I wanted the proxy to work for:

Then I went to the IP in my Shadow extension, adding port 8080 to the end (since that’s where I ran the proxy). I could see the content I was expecting for some.private.thing.local, both in Chrome and on my device:

I tried it with images and JavaScript includes as well, both of which seemed to work fine using relative paths. If you have absolute paths in your HTML link to , or that try to include , then those calls will fail – you’re forcing the device to a domain it doesn’t know.

I changed some other things in the Nodejs-proxy code as well. The full script is below, and as you can see it still clocks in at 20 lines.

I want to give a big nod to Peteris Krumins, whose original blog post about a reverse proxy server in Node.js gave me a clear path to solving the problem. And saved me from writing a lot of code.

I hope this post proves useful for you when using Adobe Shadow.

Safari Books Online has the content you need

Check out these JavaScript books available from Safari Books Online:

In Effective JavaScript: 30 Specific Ways to Harness the Power of JavaScript (Rough Cut), long-time JavaScript standards committee insider David Herman introduces 30 powerful ways to write more efficient and more robust software with the latest version of JavaScript.
In JavaScript: The Good Parts, Crockford finally digs through the steaming pile of good intentions and blunders to give you a detailed look at all the genuinely elegant parts of JavaScript.
JavaScript Testing shows you the most essential features of JavaScript, which you will be using in your daily development, testing, and debugging tasks. You will learn to use the most basic functions of JavaScript to perform ad hoc testing quickly and efficiently.

About the Author

  Duane O’Brien is a tired computer scientist. He has written a number of articles on developing web applications and various PHP frameworks. To learn more about Duane, check out his blog or read his tweets.

Tags: Adobe Shadow, Javascript, Node.js, Virtual Hosts,


  1.  Adobe Shadow – Safari Books Online's Official Blog | AdShopEZ