How to protect a webpage with a password?

Question

I have a web app with a setting page that I would like to protect with a password so that unless the password is correctly entered the user cannot change any of the settings.

Answer 1

To add a password for a page on your website, you’ll need to modify the .htaccess and .htpasswd files on the server. Take a look at this link for the full details.

Basically you need to do these two things:

1. Modify (or add) the special text file on your server called .htpasswd, to contain the username and encrypted password separated by a colon on a separate line.

If you have SSH access, this can be done automatically using the htpasswd utility:

htpasswd -c .htpasswd ben

Otherwise you can modify/create the file manually, and handcraft the username/password using an online password encryptor. The linked-to site suggests these three:

• 4WebHelp's online .htpasswd encryption tool

• Alterlinks .htaccess password generator

• htmlite's htpasswd encryption page

As an example, for a username of ben and a password of password12345 you would use this line:

ben:51CbcBM13fOMo

2. Modify (or add) the special text file called .htaccess, in the folder where the settings page you want to protect resides, to contain the following:

AuthUserFile /full/path/to/.htpasswd
AuthType Basic
AuthName "Protected Settings Page"

<Files "mySettingsPage.html">
  Require valid-user
</Files>

Of course, /full/path/to/.htpasswd should be replaced with the full path to where the .htpasswd file resides on your server.

Likewise, replace mySettingsPage.html with your own settings page name.

Note that the AuthName string can be changed to suit.