The current static site construct, doesn't really work that well as cloudfront can't handle loading the default document object (index.html) for sub directories, so support for that via an option on the construct would be awesome

I've created a cloundfront function and added it manually to the cloudfront distribution manually to do this for the time being and I'm looking at adding a lambda@edge function to do that right now

I will keep you posted when we get to this, and I will probably reach out to clarify on some of the details 🙂

Oh btw, as a side note, have u run into a similar user as @Devin in this GH issue https://github.com/serverless-stack/serverless-stack/issues/1332? According to Gastby:

In order for all the features of your site to work correctly, you must instead use your S3 bucket's Static Website Hosting Endpoint as the CloudFront origin

But if you are using the

StaticSite

construct, the CloudFront distribution is using the

S3 Bucket as Origin

. Instead of what Gastby suggests which is enabling the static hosting option on the S3 bucket and using the static hosting URL as an

HTTP Origin

.

Let me know if that makes sense to u, and if you have run into this issue.

What I have done to make this work currently is to create a CloudFront Function with the following code

function handler(event) {
    var request = event.request;
    var uri = request.uri;
    
    // Check whether the URI is missing a file name.
    if (uri.endsWith('/')) {
        request.uri += 'index.html';
    } 
    // Check whether the URI is missing a file extension.
    else if (!uri.includes('.')) {
        request.uri += '/index.html';
    }

    return request;
}

I have assigned this to the CloudFront distribution as a Viewer request function

The root cause of the issue is CloudFronts decision to only serve the default root object for the root folder: https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/DefaultRootObject.html

I have realised that I can implement this redirect using lambda@edge on the StaticSite construct (https://docs.serverless-stack.com/constructs/StaticSite#using-lambdaedge) so will do that for the time being.

@Devin working solution here: https://github.com/sourcier/sourcier-web/commit/0d8213c7d8406c642989bebd52f20fead3ae47a7

Let me know if you have any questions.

I've chosen to go with lambda@edge, but have included an example for cloud front functions as well.

I requested a certificate for my domain in ACM, then did the validation, an it just worked.