Closed9

CloudFront+S3にIP制限とBasic認証の導入を試す

lightkunlightkun

以下を作成して、S3にアップロード

first.html
<p>Hello, world!</p>
lightkunlightkun

Cludfrontデプロイ後、[ディストリビューションドメイン名]/first.htmlにアクセスできることを確認

lightkunlightkun

IP制限

Cloudfront Functionを利用する。
関数を作成して、
https://dev.classmethod.jp/articles/cloudfront-functions-ip-control/#toc-9
に記載のコードをそのまま使わせてもらう(ありがたや〜)。
IP_WHITE_LISTの部分だけ、許可したいIPに変更。

保存して、[関数の発行]をポチる。
[関連付けの追加]をポチって、「ディストリビューション」に先程作成したCloudfrontを選択、「キャッシュビヘイビア」は「Default(*)」で関連付けを追加する。

しばらくしてから、許可していないIPからのアクセスは403エラーになることを確認。許可IPからの場合はhello worldが表示されることを確認

lightkunlightkun

Basic認証

$ echo -n "lightkun:cloudfront123pass" | base64
bGlnaHRrdW46Y2xvdWRmcm9udDEyM3Bhc3M=

先程と同じように関数を作成し、
https://dev.classmethod.jp/articles/apply-basic-authentication-password-with-cloudfront-functions/#toc-3

のコードをありがた〜く使わせてもらう。authStringのところは↑で作成したパスワードに変更。

保存して、[関数の発行]をポチる。
[関連付けの追加]をポチって、「ディストリビューション」に先程作成したCloudfrontを選択、「キャッシュビヘイビア」は「Default(*)」で関連付けを追加する。

しばらく待っているとBasic認証のダイアログが表示される。

lightkuncloudfront123passを入力で成功し、hello worldが表示されることを確認

lightkunlightkun

Attention

↑でIP制限とBasic認証を別々の関数にしたが、1つしか関連付けできないみたい(しようとすると、既に関連付けされている関数が外れる)

https://docs.aws.amazon.com/ja_jp/AmazonCloudFront/latest/DeveloperGuide/edge-functions-restrictions.html#function-restrictions-combining-functions

イベントタイプ (ビューワーリクエスト、オリジンリクエスト、オリジンレスポンス、ビューワーレスポンス) はそれぞれ、エッジ関数の関連付けを 1 つしか持てません。

なのでIP制限+Basic認証の両方を入れるには、1つの関数で書く必要がある

lightkunlightkun

IP制限+Basic認証

これで完成。[許可するIP]は自分で設定。

function handler(event) {
    var request = event.request;
    var clientIP = event.viewer.ip;
    var headers = request.headers;
    
    // アクセス許可するIPを設定
    var IP_WHITE_LIST = [
     '[許可するIP]',
    ];
    // クライアントIPが、アクセス許可するIPに含まれていればtrueを返す
    var isPermittedIp = IP_WHITE_LIST.includes(clientIP);

    // 許可していないIPの場合
    if (isPermittedIp === false) {
        var response = {
            statusCode: 403,
            statusDescription: 'Forbidden',
        }
        // falseの場合はViewer に対してレスポンスを返す
        return response;
    }
    
    // echo -n user:pass | base64
    var authString = "Basic bGlnaHRrdW46Y2xvdWRmcm9udDEyM3Bhc3M=";
    
    if (
        typeof headers.authorization === "undefined" ||
        headers.authorization.value !== authString
    ) {
        return {
        statusCode: 401,
        statusDescription: "Unauthorized",
        headers: { "www-authenticate": { value: "Basic" } }
    };
  }

  return request;
}
このスクラップは2022/08/29にクローズされました