Using Remote Image Files When You Develop Locally

If you work on large Drupal sites, you probably run into the problem of the enormous "files" directory. Keeping your development server (or personal computer) in sync with production is a big pain, but without those uploads and file attachments, it's easy to miss important design problems with site content.

There are lots of slow, complicated ways to solve the problem. Drush commands, shell scripts and even (please say no!) FTP can be used to download all of a site's image assets and file uploads to your local development machine. I want to save that precious disk space, though!

I started out with the Stage File Proxy module. It lets Drupal point all of its file requests to the "live" server, even when the site is running on your local development machine. While the module works well it required me to make tweaks to the site that I preferred not to worry about.

One of the issues for me was adding lines of code to settings.php. That caused issues with revision control systems and multiple developers. In addition, I had to re-enable the module after each database sync (because it is not enabled on the dev/prod sites). Finally, there's the general maintenance overhead of adding an extra module to the site. The module is a solid solution, but I wanted something more.

I found my answer in Apache URL rewrite rules. When the Apache program handles incoming web page requests, rewrite rules allow it to change URLs matching certain patterns -- for example, they can turn requests for the 'files' directory on your local machine into requests for remote URLs on the production server.

I tracked down several posts and tutorials on rewrite rules and finally landed on one that worked for me: http://dropbucket.org/node/337. I'm using MAMP: adding this snippet it was easier than installing a module, requires no changes to your site settings or configuration, and has no code to maintain or enable. The steps are a bit different if you're using a different development setup, but the principle is the same.

Here's the example code:

### Apache Rewrite
  
    RewriteEngine on
    # Force image styles that have local files that exist to be generated.
    RewriteCond %{REQUEST_URI} ^/sites/([^\/]*)/files/styles/[^\/]*/public/((.*))$
    RewriteCond %{DOCUMENT_ROOT}/sites/%1/files/%2 -f
    RewriteRule ^(.*)$ $1 [QSA,L]
    # Otherwise, send anything else that's in the files directory to the
    # production server.
    RewriteCond %{REQUEST_URI} ^/sites/[^\/]*/files/.*$
    RewriteCond %{REQUEST_URI} !^/sites/[^\/]*/files/css/.*$
    RewriteCond %{REQUEST_URI} !^/sites/[^\/]*/files/js/.*$
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)$ http://www.example.com/$1 [QSA,L]
  

Next, Open MAMP. Under the Advanced tab, you will find a small "Customized virtual host general settings" box near the bottom. Paste in the code above, but REPLACE 'http://www.example.com' with the address of the production server that contains the files you'll need.

Finally, restart Apache. That's all it took, and now I have plenty of room for cat pictures in my drive!