CATEGORY

【S3×CloudFront】トップページ以外が403エラーになる場合の対処法

静的サイトジェネレーターHUGOを使ってメディアを構築していた際に遭遇した事象。

デプロイした後に、TOPページは問題なく表示されるが、TOP以外の下層ページにアクセスした際に「AccessDenied」となっていた。

解決策

以下のソースをCloudFront Functionsに追加してあげれば表示されるようになった。

function handler(event) {
    var request = event.request;
    var uri = request.uri;

    // Check whether the URI is missing a file name.
    if (uri.endsWith('/')) {
        request.uri += 'index.html';
    }
    // Check whether the URI is missing a file extension.
    else if (!uri.includes('.')) {
        request.uri += '/index.html';
    }

    return request;
}

以下のサイトのソースをコピペでOK

index.html を追加してファイル名を含まない URL をリクエストする

手順

（１）CloudFrontの関数にアクセス

（２）関数を作成

上記の関数を貼り付ける

変更を保存して、「発行」タブに移動して関数を発行する。

（３）ディストリビューションを選択し「ビヘイビア」へ移動→編集

関数の関連付けで作成したCloudFront Functionsを紐付けて「変更を保存」

少し時間をおいてURLにアクセスすると、TOPページ以外も表示されるようになった。

この記事は役に立ちましたか？

もし参考になりましたら、下記のボタンで教えてください。

【Vue 3】Composition APIでテンプレート参照する方法 前の記事 VuetifyのOSSコントリビュートをやってみる 次の記事

関連記事

コメント

この記事へのコメントはありません。