Added support for cloudfront_custom_errors configuration block on the CloudFront Distribution to support React client side routing

Author: rdunn-Hypr

cloudfront.tf

@@ -11,6 +11,17 @@ resource "aws_cloudfront_distribution" "cdn" {
   comment             = var.comment
   default_root_object = var.index_document_default
 
+
+  dynamic "custom_error_response" {
+    for_each = var.cloudfront_custom_errors
+    content {
+      error_caching_min_ttl = custom_error_response.value["error_caching_min_ttl"]
+      error_code            = custom_error_response.value["error_code"]
+      response_code         = custom_error_response.value["response_code"]
+      response_page_path    = custom_error_response.value["response_page_path"]
+    }
+  }
+
   default_cache_behavior {
     allowed_methods  = var.cloudfront_allowed_methods
     cached_methods   = var.cloudfront_cached_methods

vars.tf

@@ -54,6 +54,16 @@ variable "url" {
   description = "The custom URL to access the site. Must match the certificate name to provide a valid TLS connection."
 }
 
+variable cloudfront_custom_errors {
+  description = "A map of custom error settings for the CloudFront Distribution"
+  type        = list(object({
+    error_caching_min_ttl = number
+    error_code            = number
+    response_code         = number
+    response_page_path    = string
+  }))
+  default     = []
+}
 variable "cloudfront_allowed_methods" {
   description = " Controls which HTTP methods CloudFront processes and forwards to your Amazon S3 bucket or your custom origin."
   type        = list(string)