Add Trailing Slash to AWS CloudFront Request

This website is an Ember application, rendered into static HTML files by prember, deployed to AWS S3 by ember-cli-deploy, and served by AWS CloudFront.

The static files are rendered as **/index.html as explained in the prember README.

However, in order to prevent S3 from returning 302 Moved Temporarily when CloudFront forwards a request without a trailing slash we need to modify the URI of the request using Lambda@Edge.

The following very simple Lambda function adds a trailing slash if the URI doesn't contain an extension or a trailing slash.

const path = require('path');
exports.handler = async (event) => {
  const { request } = event.Records[0].cf;
  const { uri } = request;
  const extension = path.extname(uri);
  if (extension && extension.length > 0) {
    return request;
  }
  const last_character = uri.slice(-1);
  if (last_character === "/") {
    return request;
  }
  const newUri = `${uri}/`;
  console.log(`Rewriting ${uri} to ${newUri}...`);
  request.uri = newUri;
  return request;
};

That's it! Trigger the Lambda function with a CloudFront viewer request event, and the request's URI will have the trailing slash added which S3 will handle without a redirect. That'll save 50ms (give or take) and be more search engine friendly.

The function needs to be written in Node (sorry Ruby) since it will be deployed via Lambda@Edge.