ベーシック認証とは、ページやファイルにアクセス制限をかけることができる認証方法の1つです。
認証をかけたサイトは、ユーザー名とパスワードを入力しないとサイトが閲覧できないので、公開前のサイトをクライアントに確認してもらう時や、特定の人にだけアクセスができるようにしたい場合に、ベーシック認証を設定します。
ちなみに、私は自分のポートフォリオのサイトは、会社で作成したものも載せているので、ベーシック認証をかけています!
というわけで今回は「ベーシック認証でサイトに制限をかける方法!」をご紹介します!
ベーシック認証の注意点
ベーシック認証を設定する前に注意点というか、理解しておいてほしいことがあります。
それは「ベーシック認証は、あくまでも簡易的な認証方法である」ということです。
2つのファイルを作成するだけで手軽にアクセス制限ができるという反面、セキュリティとしては弱いということを意識しておきましょう。(例えば、一度ログインすれば、ブラウザを閉じるまでアクセス許可状態が続くなど。)
使用用途としては、冒頭でも言ったように、自分のポートフォリオサイトや公開前のサイトの確認用などで使うのがベターでしょう。
ベーシック認証の設定方法
ではさっそくベーシック認証のかけ方を説明していきます。
簡単に説明すると、「.htaccess」と「.htpasswd」というファイル名の2つのテキストファイルを作成し、サーバー内の制限をかけたいコンテンツがある所のディレクトリにアップロードするだけです。
2つのファイルを作成
では「.htaccess」と「.htpasswd」を作成していきます。
メモ帳などのテキストエディターで、それぞれ「.htaccess」「.htpasswd」というファイル名のテキストデータを作成します。
※拡張子(.txt)は消してください。
MACの場合はcommand + shift + .(ドットキー)を押して、隠しファイルを表示してからでないと、ファイル名を.htaccessに変更できないので注意。
.htaccess
Webサーバーをディレクトリ単位で制御するためのファイル。ベーシック認証・リダイレクト・404エラーページの作成などを行えます。
テキストデータの中身は以下の通り。
AuthUserFile (対象ディレクトリまでのフルパス)/.htpasswd
AuthType Basic
AuthName "Please enter your ID and password"
require valid-user
対象ディレクトリまでのパスがわからない場合
PHPファイルを使って、AuthUserFileに書くフルパスを調べることができます。
テキストエディタで下記のコードを記述して、拡張子「.php」のデータを作成します。(今回はpath.phpという名前で説明します。)
<?php
echo __FILE__;
?>
作成したpath.phpをベーシック認証を設定するディレクトリにアップロードして、ブラウザからアクセスします。
例・ hogehoge.jp/works/path.php
すると、アップロードしたPHPファイルのフルパスがブラウザ上に表示されるので、AuthUserFileの箇所にコピペします。
※末尾に「/.htpasswd」をつけ忘れないように。
.htpasswd
認証に使うためのユーザー名とパスワードを記載したファイル
ファイル内にはユーザーIDとパスワードを記述します。行数を増やせば、どんどんユーザーを増やすこともできます。
ユーザー名:暗号化したパスワード
/*増やしたい場合*/
ユーザー名:暗号化したパスワード
ユーザー名:暗号化したパスワード
ユーザー名:暗号化したパスワード
パスワードは必ず暗号化したものを使いましょう。
下記URL先で、パスワードを暗号化することができるので、生成されたテキストをそのまま.htpasswdファイルに貼り付けてください。
https://www.luft.co.jp/cgi/htpasswd.php
「.htaccess」と「.htpasswd」の準備ができたらディレクトリにアップロード!
ベーシック認証を確認する
ファイルがアップロード出来たらベーシック認証がかかっているはずです。
ファイルをアップロードしたディレクトリにアクセスして、下記のようなダイアログが表示されたら成功です。
もし表示されない場合は、ファイルを上げるディレクトリが違うか、.htaccessの記述が間違っているということが考えられますので、再度1から確認してみましょう。
ワードプレスの場合
ワードプレスの場合は、URLの末尾に「wp-admin」や「wp-login.php」などと記載すると誰でもログイン画面までは入れてしまうので、セキュリティを高めるために管理画面にベーシック認証をかけていきます。
「wp-adminフォルダの直下」に「.htaccess」と「.htpasswd」の二つのファイルを置いてください。以上です!