Facebook X (Twitter) Instagram
    TecAdmin
    • Home
    • FeedBack
    • Submit Article
    • About Us
    Facebook X (Twitter) Instagram
    TecAdmin
    You are at:Home»General Articles»S3 & Cloudfront: 404 Error on Page Reload (Resolved)

    S3 & Cloudfront: 404 Error on Page Reload (Resolved)

    By RahulJuly 15, 20222 Mins Read

    I have recently deployed a published Node.js application via Amazon S3 static website hosting. After deployment, I noticed that we get the 404 error message while refreshing the pages. After a few searching, I got the reason behind it. I found that the application required a special configuration for routing like .htaccess in Apache servers. But here is the issue, we can’t use the .htaccess file with S3 static website hosting.

    In this tutorial, we will discuss solving this issue with the options provides under the S3 configuration. Also, provide you with instructions to fix this issue for the users using the Cloudfront.

    Amazon S3 (Static Website Hosting)

    Amazon S3 uses index.html as default index file. If your application is hosted on Amazon s3 static website hosting. You just need to configure index.html in the Error document.

    Go to the application S3 bucket -> Properties -> Static website hosting and set the Error document as showing in below image:

    React Handle 404 Error with CloudFront

    Amazon CloudFront

    In the case of using Amazon Cloudfront with an s3 bucket, You also need to configure the Error pages in Cloudfront.

    Edit the Cloudfront -> Error pages. Now create a custom error response for 404 to index.html. You can also do the same for the 403 error code.

    React Handle 404 Error with S3 Bucket

    Conclusion

    This blog post helped you to resolve the 404 error with Amazon S3 and Cloudfront.

    Amazon s3 Cloudfront Error Code 404
    Share. Facebook Twitter Pinterest LinkedIn Tumblr Email WhatsApp

    Related Posts

    Using .env File in FastAPI

    Setting Up Email Notifications for Django Error Reporting

    How to Enable Apache Rewrite (mod_rewrite) Module

    Add A Comment

    Leave A Reply Cancel Reply

    Advertisement
    Recent Posts
    • Using .env File in FastAPI
    • Setting Up Email Notifications for Django Error Reporting
    • How to Enable Apache Rewrite (mod_rewrite) Module
    • What are Microservices?
    • Variable Expansion in ZSH
    Facebook X (Twitter) Instagram Pinterest
    © 2023 Tecadmin.net. All Rights Reserved | Terms  | Privacy Policy

    Type above and press Enter to search. Press Esc to cancel.