エックスサーバーでサイトにパスワード（ベーシック認証・アクセス制限）を設定する方法

目次

1. エックスサーバーでベーシック認証を設定する手順
2. ベーシック認証の文字数について
3. ベーシック認証で使える記号、使えない記号
4. ベーシック認証のユーザーIDとパスワードを含んだURLを作成する方法
5. Google Chrome、Firefox、Safariでのベーシック認証の見え方
6. ベーシック認証を設定したページが「見れません」と言われたときに疑うこと

世間一般的には「サイトにパスワードをつける」と表現しますが、WEB制作者はこれを「ベーシック（Basic）認証をかける」「ベーシック認証を設定する」と言います。
エックスサーバーのサーバーパネルでは「アクセス制限」という表記なっています。

数年前まで、ベーシック認証を設定するには、「.htaccess（ドットエイチティーアクセス）」というファイルにコード（命令文）を記述する必要がありました。
しかし現在エックスサーバーでは、サーバーパネル内でベーシック認証が簡単に設定できるようになっています。

エックスサーバーでベーシック認証を設定する手順

対象ドメインを選択した状態のサーバーパネル。
メニュー「ホームページ」の中のサブメニューに「アクセス制限」があるのでクリックします。

今回は「test」という名前のディレクトリ（階層）にベーシック認証を設定します。
フォルダ名「test」の「ユーザー設定」をクリックします。

説明欄には「指定のディレクトリに対してベーシック認証をかけることができます。会員制のサイトなどを運用する場合に使用してください」と記載されています。
フォルダ名「現在のフォルダ」では、トップページ（サイト全体）にベーシック認証を設定することができます。

設定前に注意する点

ベーシック認証を設定するディレクトリ内の、画像や動画などのファイルを、トップページやその他のディレクトリのページで表示（参照）していませんか？ブラウザ（Google ChromeやSafariなど）はベーシック認証が設定されているディレクトリ内のファイルを表示するために、それがトップページやその他のディレクトリのページであっても、ユーザーIDとパスワードの入力を求めることになります。

次に「ユーザーID」と「パスワード」を入力し、「確認画面へ進む」をクリックします。

文字数の制限や使用できる記号などは下記にまとめていますので、後ほどご確認ください。

ユーザーIDはひとつではなく、複数設定することが可能です。

ユーザー設定追加の確認画面が表示されるので、「追加する」をクリックします。

追加完了のページが表示されるので、「フォルダに戻る」をクリックします。

フォルダ一覧に戻り、「アクセス制限」の「ON」を選択し、「設定する」をクリックします。

「ベーシック認証の設定変更が完了しました」と表示されます。
これで設定は完了です。

ベーシック認証の設定を解除する場合

フォルダ一覧に戻り「アクセス制限」の「OF」を選択し「設定する」をクリックします。

ベーシック認証の文字数について

ユーザID、パスワード共に、半角1文字以上、255文字以内で入力する必要があります。

	ユーザID	パスワード
最小文字数	半角1文字	半角1文字
最大文字数	255文字	255文字

ベーシック認証で使える記号、使えない記号

代表的な記号を30個ピックアップして、実際に検証してみました。
「ハイフン（-）とアンダーバー（_）」など、わかりづらいものもあるかと思いますが、マウスで選択していただければ、なんとなく分かっていただけるかと思います。

ユーザーIDは『メールアドレスに含まれる記号「@」「.」「-」「_」が使用できる』と覚えることができそうです。

ベーシック認証のユーザーIDとパスワードを含んだURLを作成する方法

ドメインが「★★★★★.com」、ベーシック認証をかけたディレクトリが「test」の場合

URL：https://★★★★★.com/test/
ユーザーID：1111
パスワード：2222

ユーザーIDとパスワードを含んだURLは

https://1111:2222@★★★★★.com/test/

となります。

Google Chrome、Firefox、Safariでのベーシック認証の見え方

個人的にはGoogle Chromeのベーシック認証が、柔らかい雰囲気で、一番可愛らしく見えます。

ベーシック認証を設定したページが「見れません」と言われたときに疑うこと

正しい手順でベーシック認証を設定しても、相手（クライアントやユーザー）から「ページが見れません」「アクセスできません」と言われることが多々あります。

一番多いのは、相手が「Chatwork（チャットワーク）」や「LINE」や「Facebookメッセンジャー」などスマホのメッセージアプリで（ベーシック認証を設定した）URLをクリック（タップ）し、アプリ上のブラウザ表示機能（WebView）でページにアクセスしてしまうケースです。
標準ブラウザでアクセスするように説明をしましょう（iPhoneの場合はリンクを「Safariで開く」という選択ができます）。

次に多いのが、ユーザーIDやパスワードを全角で入力してしまうケースです。
全角と半角の違いがわからない方はたくさんいます。
知らせたユーザーIDとパスワードをコピーアンドペーストで入力してもらうのが確実です。

その次に多いのが「前回はアクセスできたけど、今回はアクセスできない」というケースです。
これは、こちら側でベーシック認証を変更した際に発生することが多いです。
相手が使用するブラウザが、古いユーザーIDとパスワードをキャッシュ（記憶）してしまうことが原因です。
相手にキャッシュを削除していただく、変更前のユーザーIDとパスワードを再設定（追加）する、ディレクトリ名を変更してURLに変更が加わるようにするなどの対処方法があります。

追伸

もしこの記事が役に立ったときは、埼玉県越谷市に向かって「ナイスだぜ、大橋プランニング。ホームページを新規で制作するとき、リニューアルするときが来たら、お前のことを必ず思い出すぜ」と囁いていただけると幸いです。
ちなみに、今のイチオシは「ワードプレスのホームページ制作」です。
お値引きさせていただきます。