How do I redirect (301) to the same website? S3, CloudFront, Route53

0

I have a list of urls that changed to a new url within the same site, for example example.com/old-url I want it to redirect to example.com/new-url, the domain is the same. My website is a static site in S3, I'm using Route 53 and CloudFront. On which of these should I set the redirects? I tried adding a redirect rule in the bucket but it changes my site's domain to that of the bucket, it does this: example.com/old-url redirects --> example-site-bucket.s3.amazonaws.com/new-url .

Can I use an .htaccess file? What is the best method to do 301 redirects in this scenario?

Thanks in advance!

2 Answers
1

If you prefer to keep things simpler and don't require the advanced capabilities provided by Lambda@Edge, you can use S3 built-in website redirection feature.

Here's how: Create a new S3 bucket for website redirection (e.g., "example-redirects-bucket").

In this bucket, configure a simple HTML file for each redirect. For example, if you want to redirect "/old-url" to "/new-url", create an HTML file named "index.html" in the "old-url" folder with the following content:

html Copy code

<!DOCTYPE html> <html> <head> <meta http-equiv="refresh" content="0;url=https://example.com/new-url"> </head> </html> Make sure that "example-redirects-bucket" is set up as a static website and allows public access.

In your main S3 bucket where your website is hosted, configure a routing rule in the S3 bucket's properties to redirect requests for "/old-url" to the corresponding HTML file in "example-redirects-bucket." Happy Learning

Waseem
answered 8 months ago
  • Thank Waseem for your prompt answer. I just implemented this solution and it works! But, what happens if I need to redirect more than 50 urls? Can I do it with routing rules in the main S3 bucket's?

0
Accepted Answer

With a large number of redirects to handle, I think you'd be better off using Lambda@Edge along with an external data source. This way, you don't need to update your Lambda code every time you need to add/change a redirect - instead, you just modify the data source. DynamoDB Global Tables is a good option for this. Take a look at this blog post which discusses a variety of approaches. Be sure to attach your Lambda@Edge function to the Origin Request trigger so that the redirect responses are stored in the CloudFront cache.

AWS
EXPERT
Paul_L
answered 8 months ago
profile picture
EXPERT
reviewed 8 months ago
  • Thanks Paul! For now, I have 364 redirects. To keep things simpler I use a redirect.json file in my function deployment package. When the redirect happens I get "Miss from cloudfront" in the header. I was expecting "Hit from cloudfront". It's right? My Code: const redirects = require('./redirects.json').map( ({ source, destination }) => ({ source, destination }) );

    exports.handler = async event => {

    let request = event.Records[0].cf.request;
    
    for (const { source, destination } of redirects) {
      if (request.uri == source) {
        //Generate HTTP redirect response to a different landing page.
        return {
            status: '301',
            statusDescription: 'Moved Permanently',
            headers: {
              'location': [{
                key: 'Location',
                value: destination,
              }],
              'cache-control': [{
                key: 'Cache-Control',
                value: "max-age=3600"
              }],
            },
        };
      }
    }
    return request;
    

    };

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