初心者コーダーのための
HTML/CSS JavaScript PHP WordPress
難しい言葉や概念より、実践重視の入門ブログ
Web基礎知識

【.htaccess】BASIC認証とは?特定のページにアクセス制限をかける方法

BASIC認証 簡易的なログイン機能!アクセス制限を設定しよう!

BASIC認証とは、ウェブサイトにアクセス制限をかけるシステムのことです。

使用頻度は高いので、絶対に覚えておきたいですね!

サイト全体からファイル単位まで簡単に設定することができ、超便利です。

特定のウェブページにアクセスするために、ユーザー名(ID)とパスワードを簡易的に設定することができます。

ログインできる人だけがページを閲覧することができ、ログインできない人には「あなたには権限がないでしゅよ」と英語で諭されます。

セキュリティは決して強固なものではないのですが、とても簡単に設定できるため、非常に便利でよく使います。

BASIC認証の主な使い道
  • 一般公開前のウェブサイト
    公開前のテスト段階や、顧客など特定の人だけに確認してもらいたいときに
  • 会員専用ページ
    ちょっとした会員専用ページに
  • ワードプレスなどのログイン画面
    ログイン画面にさらにBASIC認証を設定し、手軽なセキュリティ強化に

BASIC認証は、「.htaccess」というファイルに記述していきます。

.htaccess…?なんぞ…?
という方は、先に下記の記事をご覧ください。

それでは、レッツBASIC認証!

BASIC認証の書き方

BASIC認証を設定するためには、2つのファイルが必要になります。

  1. .htaccess
  2. .htpasswd

まずは簡単な.htpasswdの方から見ていきましょう。

.htpasswdは、IDとパスワードの保管場所

.htpasswdは、ログインに必要となるIDとパスワードを保管しておくためのファイルです。

まずは「.htpasswd」という名前のファイルを作成します。

ファイルを入れておくディレクトリですが、概ねどこでもOKです。

ただこの後作成する.htaccessは、アクセス制限したいページのディレクトリに入れます。
なので.htpasswdも、アクセス制限をしたいページのディレクトリに入れておけばわかりやすいかと思います。

えふぃ

.htpasswdなんて聞いたことがないファイル名かもしれませんが、とっても簡単なのでご安心ください!具体的にいうと1行です!

まあ実際のところファイル名は何でもよくて、.htpasswdである必要もないのですが、一般的にこの名前で浸透しています。

.htpasswdの中身はIDとパスワードになるのですが、パスワードを暗号化する必要があります。

といっても、決して難しいものではないのでご安心を!

よそ様のウェブサイト拝借し、.htpasswdに記述する内容を自動で生成します。

今回は株式会社 DMZが提供しているブラウザツールでいきましょう。

https://tech-unlimited.com/makehtpasswd.html

ログインのためのIDをパスワードを入力し「.htpasswdを生成する」をクリックすることで簡単に生成できます。

.htpasswd生成結果をコピペするだけで完成です。

ログインのアカウント情報を複数作成したい場合は、2行3行と改行しながらコピペしていけばOKです。

それでは、いざBASIC認証を設定していきましょう!

.htaccessでBASIC認証を設定しよう!

まずはアクセス制限をかけたいページのディレクトリに「.htaccess」ファイルがあるかどうかを確認しましょう!

えふぃ

すでに.htaccessがあるのに気づかずに上書きしてしまうと、顔面蒼白案件になりかねません!

すでに.htaccessがある場合は、既存の記述に追記していくという形になります。
もしなければ「.htaccess」という名前のファイルを作成します。

先ほども軽く触れましたが、.htaccessはアクセス制限をかけたいページのディレクトリに入れます。

あれ!?.htaccessファイルを作成したのにどこにも見当たらないぞ!?
となった方は、こちらをご覧ください。.htaccessは隠しファイルです。

それでは、お待たせしました!
.htaccessに記述する内容は、以下となります。

AuthType Basic
AuthName "BASIC認証名"
AuthUserFile /サーバールートからのパス/.htpasswd
AuthGroupFile /dev/null
require valid-user

この1行目〜6行目までをコピペします。
6行目の改行もお忘れなく!.htaccessのお約束でしたね。

書き換えが必要な部分は、2行目と3行目です。

それでは、1行目から順に見ていきましょう。

1行目 AuthType Basic

BASIC認証を使いますよ」という合図です。

大したこと書いてないので読み飛ばしてOKです。

「Basic」の他に「Digest」というものがあります。

DIGEST認証は簡単にいうと、BASIC認証よりちょっとだけ強固なアクセス制限方法です。

セキュリティ面ではDIGEST認証の方が優れていると言えるのですが、それでも決して強固なものではありません。

ただDIGEST認証は対応していないブラウザがあるので、BASIC認証の方に軍配が上がっているのが現状です。

2行目 AuthName “BASIC認証名”

このBASIC認証に授けるお名前を、クォーテーションの中に記入します。

BASIC認証名なのですが、ブラウザによってログイン時のダイアログに出たり出なかったりします。

あと日本語だと文字化けすることがあります。

つまり

  • 出なくても困らない名前
  • 出てきても当たり障りのない名前
  • 英語の名前

の条件を満たすのがベター

“Please enter your ID and password”

とかにしているところをちょくちょく見かけます。

なので特にこだわりがなければ2行目は

AuthName "Please enter your ID and password"

としておきましょう!

3行目 AuthUserFile /サーバールートからのパス/.htpasswd

さて、これがちょっとだけややこしいですね!

AuthUserFileは、ログイン情報が記載されたファイル(.htpasswd)の所在を.htaccessさんに教えてあげる部分です。

サーバールートから、ファイル名(.htpasswd)までしっかりと記述する必要があります。

えふぃ

サーバールートとは、ウェブサイトのルートディレクトリよりもさらに深いところにある、サーバー関連のファイルが眠っている場所です!

ここの記述が間違っていると、.htaccessさんが.htpasswdまでたどり着けないので、正しいIDとパスワードを入力しても閲覧できなくなります。

「そんなことよりサーバーでエラー発生していますよ」と英語で言われます。

サーバールートの確認方法は、BASIC認証を設置したいディレクトリ適当にpfpファイルを作成し、以下をコピペしてブラウザで見ることができます。

<?php echo __FILE__; ?>

以下のようにサーバールートからのパスが表示されます。

このパスを丸ごとコピペし、最後にファイル名部分を.htpasswdに変更します。

AuthUserFile /サーバールート/xxx/.../xxx/目的のディレクトリ/.htpasswd

するとこんな感じになるかと思います。

これでOK!
書き換えが必要な部分はここまでです。

4行目5行目はただのちょっとした説明になるので読み飛ばしてもOKです。

4行目 AuthGroupFile /dev/null

AuthGroupFileは、.htgrouptというファイルを参照するためのパスを書く部分なのですが、.htaccessでは使う必要がありません。

そのためそのファイルは存在しませんよ(/dev/null)という指示がされています。

5行目 require valid-user

requireは、アクセス可能なユーザーを指定する部分です。

全ユーザー対象ですよ(valid-user)という指示がされています。

BASIC認証の有効範囲について

BASIC認証の有効範囲は通常の.htaccessと同じで、.htaccessの入っているディレクトリと、それ以降の階層全てが対象となります。

有効範囲についての詳細はこちらをご覧ください。

ファイル単位でアクセス制限をかけたい場合は、先ほどの6行に、2行だけ記述を増やす必要があります。

えふぃ

ワードプレスのログイン画面にBASIC認証を設定する場合、「wp-login.php」だけを指定します!

特定のファイルのみBASIC認証を設定する方法

先ほどの基本的なBASIC認証の方法に、2行書き足すだけです。

<Files ファイル名>
AuthType Basic
AuthName "BASIC認証名"
AuthUserFile /サーバールートからのパス/.htpasswd
AuthGroupFile /dev/null
require valid-user
</Files>

1行目と7行目が新しく追加されました。

1行目にファイル名を記入するだけでOKです!

またパスの指定は無効なのでご注意!

ワードプレスのログイン画面だけにBASIC認証を設定したい場合はこのようになります。

<Files wp-login.php>
AuthType Basic
AuthName "BASIC認証名"
AuthUserFile /サーバールートからのパス/.htpasswd
AuthGroupFile /dev/null
require valid-user
</Files>

もちろん、この.htaccessはワードプレスのファイルをインストールしたディレクトリに入れます。

ワードプレスをインストールしたディレクトリには、すでに.htaccessが存在しているので新規ファイルを作成して上書きなんてしないように!

BASIC認証がうまくいかない場合

言われた通りにやってるはずなのにうまくいかない!

ってことよくありますよね。僕はあります。

ということで、BASIC認証がうまくいかない原因を、いくつかピックアップしておきます。

BASIC認証がうまくいかない原因

大体このあたりではないかと思います!

BASIC認証がうまくいかない原因
  • ディレクトリの設置先が間違えている
    .htaccess、.htpasswdの配置を間違えていませんか?
  • 記述を間違えている
    変な文字が混ざっていたり、必要なものが消えていたりしていませんか?
  • .htpasswdまでのパスが違っている
    サーバールートから正しくパスは指定されていますか?
    パスの最後に.htpasswdが抜けていませんか?
  • 特殊な文字や記号を使っている
    BASIC認証名をとがったネーミングにしていませんか?
  • .htpasswdのパスワードを暗号化していない
    ちゃんとパスワードの暗号化をしましたか?
  • 契約しているサーバーがApacheじゃない
    .htaccessはOSがApacheの場合しか使えません。
  • 契約しているサーバー会社が許可していない
    サーバー会社によっては、.htaccessの使用にそもそも制限をかけている場合があります。

そもそもサーバーによっては.htaccessが使えない場合があるので、契約しているサーバー会社の公式ページから確認しましょう。

全部クリアしているのにどうしてもうまくいかないんだ!

という方もご安心ください!
まだ助かるまだ助かる。

サーバーの管理画面からも設定できるよ

自ら.htaccessを記述しなくとも、契約しているサーバー会社の管理画面から、BASIC認証を設定できる場合が多いです。

その場合色々制約があったりもするのですが、これも1つの手です。

というか.htaccessを自分で変に触ってしまうと致命的なエラーが発生する可能性があるのですが、サーバー会社の管理画面から設定すると致命的なエラーは発生しないはずなので、むしろこちらのほうが安心です。

再度言いますが、ちょっとした制約はあったりはします。

パッと思いつくものでは、

  • パスワードが8文字以上で記号を入れる必要がある
    ちょっとした開発で簡単なパスワードにしたかったのに…
  • ファイル単位での制御ができない
    ワードプレスのログイン画面だけBASIC認証を設定したかったのに…

とかは今までありました。

いまさらBASIC認証とは

ここまできていまさらBASIC認証について説明します。

だって細かい座学なんかより実践優先したい…。

BASIC認証とは、ウェブサイトに簡易的にアクセス制限をかけるシステムのことです。

ちゃちゃっと箇条書きで説明して終わりにしましょう。

BASIC認証について
  • 指定したIDとパスワードを入力することで閲覧可能になる
  • .htaccess、.htpasswdの2つのファイルから構成される
  • .htaccessに記述していくため有効範囲は.htaccessと同じ
    ただしファイル単位での制御も可能
  • 有効期間はブラウザを閉じるまで
  • クローラーも巡回できないため検索にもひっかからない
  • セキュリティ的には強固なものではない
    Base64という、たった64文字から構成される文字コードを使っているため

BASIC認証は、セキュリティ的には決して強固なものではないのですが、手軽に導入することができるのでとっても便利です。

使用頻度は高いので、絶対に覚えておきたいですね!

今日もあなたが夢に向かって一歩前進できていますように。
お疲れ様でした。