By using AWS re:Post, you agree to the AWS re:Post Terms of Use
AWS re:Postre:Post

How to set up index.html in cloudfront as a root objest if it is not in a root folder?

0

Hello. I am getting all the time an error:

Code: NoSuchKey Message: The specified key does not exist. Key: index.html

We are using Next Js to build our app and publish on cloudfront. But the problem is that ./next folder (main folder for the build artefact) has no any index.html in its root. This file index.html is in ./next/server/pages/ folder after build is done and in ./standalone/.next/server/pages/index.html So, how to setup index.html with the path as a root object in cloudfront to be able to load it after typing of our root domain (without any extra /path/and/so/on/index.html? I tried to do it in cloudfront cache behavior or s3 properties but it does not work. Any ideas? Thanks.

Topics
StorageNetworking & Content Delivery
Tags
Amazon Simple Storage ServiceAmazon CloudFront
Language
English
kostyanius
asked 7 months ago235 views
2 Answers
0

Hi,

Do you really need to expose all these folders instead of only /pages/? If not, I would suggest to either do not upload them to S3 during the deployment or/and use Origin path set.

CloudFront Origin path

profile picture
EXPERT
Dmytro Sirant
answered 7 months ago
  • kostyanius
    7 months ago

    Hello Well, i have started from /pages deploy, but there is an issue, that this folder does not include all the neccessary files for this app. For example /img and other, and as a result deployment site looks ugly. That is why i have tried to deploy ./next folder instead, but it has no strict structure (like should be in artefact folder). Also i tried to run "npx next export" but it generates only pages folder without any other needed. So i suppose there is an issue with export. But the strange thing is that ./next folder works perfectly in AWS amplify but doesn`t work properly on cloudfront.

  • Dmytro Sirant EXPERT
    7 months ago

    Take a look if this instruction helps https://gist.github.com/rbalicki2/30e8ee5fb5bc2018923a06c5ea5e3ea5

0

Hi,

You can use cloudfront function to re-write the URL and fullfill your requirement. Please take a look at the following links for more detailed information.

https://github.com/aws-samples/amazon-cloudfront-functions/tree/main/url-rewrite-single-page-apps

https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/example-function-add-index.html

Hope this helps.

AWS
Shekhar S
answered 7 months ago

You are not logged in. Log in to post an answer.

A good answer clearly answers the question and provides constructive feedback and encourages professional growth in the question asker.

Guidelines for Answering Questions

Relevant content