はじめに

開発環境では特定の人（例えば自社の人）だけが見れるようにアクセス制限をすることがあると思います。
アクセス制限の選択肢としてBasic認証やIP制限が考えられますが、Basic認証をしたい場合、みなさんどうしていますか？

AWS WAFでやる
CloudFrontFunctionsでやる
Lambda@Edgeでやる
Webサーバ(Apacheなど)の設定でやる
などあるかと思います。

その中で今回はAWS WAFを使ってBasic認証を行う方法を説明します。

やってみた

では、実際にやってみましょう。
今回は、ALB(Application Load Balancer)にBasic認証を設定します。

Web ACLの作成

基本情報と紐づけるリソースの設定

左メニューのWeb ACLsからCreate web ACLをクリックします。

Resource typeとしてRegional resoucesを選択します
RegionはTokyoを選択します
Nameは任意のACL名にします。今回はbasic-authenticationとでもしておきます

CloudFrontにBasci認証をかけたい場合は、Resource typeとしてCloudFront distributionsを選択してください！

Resource typeとしてApplication Load Balancerを選択します
すると既存のALBがリスト表示されるので、Basic認証をかけたいALBにチェックを付けます

他にもAPI GatewayなどにBasic認証をかけることが出来ます

ルールの作成

次にルールを作成します。
今回は、設定した認証情報以外は、アクセスを拒否するようなルールを作成します

Add rulesからAdd my own rules and rule groupsを選択します

ルールの基本情報を入力します

Rule builderを選択します
Nameは任意のルール名にします。今回はbasic-authenticationとでもしておきます
RuleからRegular Ruleを選択します

ルールの詳細を入力します

リクエストが一致しない場合に拒否したいので、If a requestでdoesnt match the statement(NOT)を選択します
InsepectでSingle headerを選択します
Basic認証に利用するヘッダーとして、Header field nameにauthorizationを設定します
Match typeにExactly matches stringを選択します
String to matchに設定するBasic認証の情報を入力します
Text transformationにNoneを選択します

例えば、ユーザ名がhoge、パスワードがhugaのBasic認証をかけたい場合は、以下のコマンドで出力されたBase64エンコード文字列を設定します
echo -n 'hoge:huga' | base64

次に、ルールの評価結果どうするかを設定します

認証情報が誤っている場合はリクエストをブロックしたいので、ActionにBlockを設定します
Custom ResponseをEnableにし、Response Codeを401にします
KeyにWWW-Authenticate、ValueにBasic realm="Basic"を入力し、エラー時のレスポンスヘッダーを設定します

Default actionはAllowを選択します

確認と作成

後はそのままで、Create web ACLをクリックすると、Web ACLが作成されます

アクセスしてみる

Basic認証がちゃんとかかったかALBのURLにアクセスしてみましょう。
ちゃんとBasic認証のダイアログが出ましたね
間違った情報を入力すると、カスタムレスポンスに設定したステータスコードとレスポンスヘッダーが返ってくることも確認出来ました

おまけ(AWSを使わないでBasic認証を場合)

例えば、LAMP環境でBasic認証をしたいとなった場合、Apacheで設定することになると思います。

Apacheの設定

以下簡単にWordPress環境のApacheでの設定例を記載します。
※Apacheのバージョンによって設定ファイルの場所などは変わりますので、ご注意ください

# Basic認証のユーザを作成
sudo /opt/bitnami/apache/bin/htpasswd -cb /opt/bitnami/apache/test_user ${ユーザ名} ${パスワード}

# Apacheの設定ファイルに以下を追加
sudo vim /opt/bitnami/apache/conf/vhosts/htaccess/wordpress-htaccess.conf

<Directory "/opt/bitnami/wordpress">
    AuthType Basic
    AuthName "Authentication required"
    AuthUserFile "/opt/bitnami/apache/test_user"
    Require valid-user
</Directory>

#設定ファイルを読み込み
sudo apachectl graceful

おわりに

今回はAWS WAFを使ってBasic認証を行う方法について紹介しました。
バックエンド側の修正をせず、AWSだけで行えるのは便利ですね