WEBサイト全体や特定のページにパスワードをかけて、公開先を限定したい。
だけど、ログインページを作るのはハードルが高そうだし、どこの誰が書いたコードかわからないコードをコピペして作るのはなんだか不安。
そんなときに使えるのがBASIC認証という仕組み。
もともとHTTP通信に備わった機能を使って作る認証の仕組み。
お作法に沿って設定ファイル（.htaccess）とパスワード管理ファイル（.htpasswd）作って、パスワードを掛けたいページのディレクトリに置くだけで実装できてしまう手軽さが魅力。
手軽なだけで、セキュリティはどうなの？
となりますが、パスワードもハッシュ化したものを設置しますので、セキュリティ面も安心の仕組みとなっています。
こんな感じのログインページが完成します。
ID：user
パスワード：PS5555
それでは早速作り方を見ていきましょう。
仕組み
パスワードはディレクトリ単位で設定します。
特定のページにパスワードを掛ける場合は、そのページだけが入ったディレクトリを用意し、.htaccessファイルと.htpasswdファイルを格納します。
ディレクトリの中の完成形は↓こんなイメージです。
このディレクトリでは動画ページにパスワードを掛けているため、「movie」というディレクトリの中にmovie.htmlというページだけが入っている状態になります。
作り方
それでは早速作り方を見ていきましょう。
仕組みのところで説明したようにパスワードを掛けるページのhtmlファイルと.htaccessファイル、.htpasswdファイルを用意して同じディレクトリに入れます。
.htaccessファイルを用意する
それでは設定ファイルの.htaccessファイルの中身を書いていきましょう。
中身はこんな感じになります。
AuthType Basic
AuthName "任意の名称"
AuthUserFile /パスワードをかけるディレクトリ名/.htpasswd
Require valid-userAuthType
BASIC認証の場合はBasicとしますので、このままコピペしてください。
AuthName
AuthNameは任意の名称をつけてOKですが、日本語だと文字化けする可能性があるので英数字で記述するようにしましょう。
AuthUserFile
AuthUserFileには.htpasswdがある場所を記述します。
Require
Requireでは全てのユーザにパスワードを求めるようにvalid-userを書いておきます。
.htpasswdファイルを用意する
最後に.htpasswdファイルを作成します。
.htpasswdの中にはユーザーIDとパスワードを書きます。
ユーザーIDは用意したIDをそのまま書けばOKですが、パスワードはハッシュ化したものを記述する必要があります。
例えば「PS5555」というパスワードを設定したい場合に、このまま.htpasswdファイルに書いてもうまくいきません。
ネットで検索すると無料変換できるサイトがあります。
今回はLUFT TOOLSさんのツールを使って変換してみましょう。
IDを「user」、パスワードを「PS5555」で変換すると「user:kn6d12FBrgv1s」が出力されました。
これを.htpasswdのファイルにコピペして保存して完成です。
ちなみにコロンを挟んで「ID:パスワード」の構成になっています。
複数のパスワードやIDを使用したい場合には、.htpasswdファイルに改行して記述しておくことで実現可能です。
こんな感じです。
user:kn6d12FBrgv1s user2:NXbpvki2QZXvM
サーバーに設置する
最後にサーバーにアップしたら完成です。
アクセスしてちゃんとログインできるか確認してみましょう。
↓こんな感じでうまくいきましたか？
ID：user
パスワード：PS5555
でログインできます。
コメント