Search code examples
amazon-s3amazon-cloudfront

Language specific 404 error page in cloudfront

I have a cloudfront distribution serving an s3 bucket. To make the page multilanguage, I added a lamba@edge function that analyzes the Accept-Language header and redirects /<page> to /en/<page> or /de/<page>.

The redirect happens with a 303 return code so that the users gets /en/<page> as the path shown in the browser and can switch languages by going to /de/<page>.

Works! But what is in case of a 404? If I configure a custom 404 page in S3 or cloudfront and the user requests /de/<non-existing-page>, he gets redirected to the custom 404 page (for example /error-pages/404). But that page is not translated!

Is there a way to make the 404 page language specific? Depending on if the user comes from /en/<page> or /de/<page>?

Solution

  • I found a solution.

    1. use 2 S3 Buckets (or as many, as you have languages), one for each language and put the files for each language in the corresponding bucket
    2. configure the ErrorDocument for each bucket to the language-specific 404 page
    3. In your CloudFront distribution configure an origin and behavior for each language such that the PathPattern /<language>/* is directed to the origin fetching from the s3 bucket for language <language>