How to password protect development and staging sites with .htaccess

It's easy to password protect your development and staging sites using .htaccess. But, when you're working with multiple environments and have .htaccess in your source control repository (like Git or SVN), it's a little trickier.

I think most developers understand it's a good practice to password protect development and staging sites. It keeps the public from seeing work in progess and prevents search engines from dinging you for duplicate content. We prefer to use .htaccess for setting up the password because it's lightweight and doesn't interfere with any member logins that might be native to your CMS or app.

If you're not including .htaccess in your source code repository, it's trivial to add the password requirement on your development and staging sites, but exclude it from the production site.

The issue we ran into was when we wanted to include the .htaccess file in our Git repository. We wanted that file to be in Git because it can contain some important configurations like PHP settings and redirects. But, if the .htaccess file is in Git, that means it has to be the same file for every environment.

So, how do you have a single .htaccess file that password protects one environment, but not another? Like this.

SetEnvIf Host staging.domain.com passreq
AuthType Basic
AuthName "Password Required"
AuthUserFile /full/path/to/.htpasswd
Require valid-user
Order allow,deny
Allow from all
Deny from env=passreq
Satisfy any

Gist

To use this on your site, change staging.domain.com in line #1 to the full domain name of your development or staging site and set the full path to your .htpasswd file on line #4.

Lines #6-8 is where the magic happens. It basically says, allow anyone to access the site unless the hostname matches your development site's domain.

Posted November 27, 2012 by Jason Siffring

Jason has over 15 years of web development experience and is the owner of Surprise Highway. Follow him on Twitter or Google+.

18 comments  

Ben Parizek Ben Parizek
on January 13, 2013

Nice trick Jason.

After reading your article I tried to implement this for our own websites.  I had to look up how to generate a password for the htpasswd file so thought I would post how to do so here for anyone else interested.

To generate your password, just open up your command line application and run the following command:
htpasswd -nb username password

That will output a string like so:
username:$apr1$MqlS50uH$ufPMzCeYdTGF9ZjTcspuT0

Copy that string into your .htpasswd file at the location referenced in the gist on line 4.  If you want to add multiple logins, just add them each on a separate line.

Jason Siffring Jason Siffring
on January 13, 2013

Thanks for the addition Ben!

Steve Marks Steve Marks
on December 18, 2013

Have just spent the last half an hour trying to figure this out after putting a site into git and therefore having to use the same .htaccess file.

Thanks so much! Worked a treat :)

Jonathan Jonathan
on January 18, 2014

Thanks for the info.  I have just had to do this for my staging subdomain.

However, I found a much simpler solution.  In cPanel you can password protect directories.  I did this in just a few clicks.  Hope that helps the more novice readers, like myself.

Mike Mike
on April 3, 2014

What happens if the app your trying to protect actually uses basic auth?

Jason Siffring Jason Siffring
on April 3, 2014

@mike you wouldn’t need this then. You’d just use basic auth for your production site too, right?

Mike Mike
on April 3, 2014

True, but it would be nice to block even the login page and all that. Literally just block everything at dev.example.com until authenticated. Then they would have to authenticate with the application itself. I think at this point the only way to do it without VPN would be some sort of proxy server.

Howdy Stranger Michael
on July 24, 2014

Very close to what I’m looking for.  Any thoughts on how to make this work for multiple development subdomains (e.g. dev.domain.com and staging.domain.com)?

Jason Siffring Jason Siffring
on July 25, 2014

Hi Michael,

I believe you can just duplicate line number one for each subdomain you want to protect.

Loek Wetzels Loek Wetzels
on November 27, 2014

I left a comment on your github gist to point out a security issue with this approach. Thought I’d share it here too, to let other users know the potential risks:

This is a nice little trick for basic needs, but it’s not very safe as it could easily be spoofed in a few basic steps:
1) find the ip address of staging.domain.com by using ping (example result IP: 66.96.162.136)
2) add a custom hostname to the hosts file pointing to this ip address: 66.96.162.136 omgihazaccess
3) open http://omgihazaccess in the browser
Tada, no password required!

The other way around would be a little safer (require password in all cases, except when using production domain) but could still be spoofed if the attacked pointed the production hostname to the staging server ip address.

Howdy Stranger maschmann
on November 13, 2015

You can also use a regex, describing a general pattern for your dev domains:

SetEnvIf Host “^(dev\.vm\.|preview?\.)(.*)” passreq

;-)

Howdy Stranger Vahag
on June 17, 2016

Thanks, it works for me ))))

Howdy Stranger Muneeb
on September 20, 2016

quick question here…. what will be the full path to the .htpasswd file?

“AuthUserFile /full/path/to/.htpasswd”

both htaccess and htpasswd are in same directory and i tried on my local machine and it only worked until i put full absolute path to the file. how I’m suppose to provide absolute path on live server.

Howdy Stranger David
on October 6, 2016

I have used plugins for this before lol. I did not realize it could be this simple.

Thanks for the post Jason! This made things a lot easier for the future.

Howdy Stranger Olivia
on October 7, 2016

“I believe you can just duplicate line number one for each subdomain you want to protect.”

This worked for me.

Howdy Stranger Amy
on October 14, 2016

I have to agree with Jonathan up above. If you are using cPanel its a lot easier to just right click and password protect a directory.  If you don’t have cPanel this is great though. Thanks for the article.

Howdy Stranger DanG
on December 6, 2016

It worked perfectly.
From Cpanel if I protect the development site that is the Public Html then the add-on Under Construction domain in a subfolder is unfortunately also affected.

However using your technique the Under Construction domain is public even though its a sub-folder the the password protected Public Html folder.

AWESOME!

Thanks again

Mike Mike
on April 12, 2017

htaccess is the useful file for protecting our site.
In this article, I learned one more security feature about htaccess.

It is really useful. Thanks for this.

Add your comment

Howdy Stranger
Redesigning Surprise Highway
← Previous
Tips for getting invoices paid faster
Next→
© 2017 Surprise Highway Inc.