Static websites fail to rewrite URL for sub directories

[tonivdv]

Description

I think that since the changes from #175 there is BC break introduced for the 'static-website' type deploy. When deploy a static website that has an index.html in a sub directory , that file will not be loaded automatically anymore. To view to page you have to explicitly provide the index.html in the url.

❌ - https://some-website/sub-directory
✅ - https://some-website/sub-directory/index.html

From what I could see, is that previously the static-website was deployed with the S3 static website feature. Now it doesn't causing it to fail.

How to Reproduce

Deploy a static website with some sub directories and an index.html page in it and deploy like a static website

constructs:
  app:
    type: static-website

If you then open the url with the subdirectory you will get following error:

<Error>
<Code>AccessDenied</Code>
<Message>Access Denied</Message>
<RequestId>XXXX</RequestId>
<HostId>XXXX</HostId>
</Error>

Additional Information

Additionally, the problem is well explained here and with a possible solution.

[mnapoli]

Are you sure that https://some-website/sub-directory used to work?

To my knowledge this wasn't supported: you had to use https://some-website/sub-directory/ URLs, but I may be wrong 🤔

@adriencaccia does that ring a bell?

[tonivdv]

@mnapoli I can confirm that in version 1.12.1 this is working. The main difference:

In 1.12.1 we have:

• s3 bucket that is set to publicly available
• Static website hosting enabled

In 1.14.0:

• s3 bucket is not publicly available and only authorises Cloudfront (this is actually a very good improvement)
• Static website hosting disabled

The solution for 1.14 is to either re-enable static website hosting or to add a lambda for the request event with:

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 will test this manually and let you know if both or one of the solutions do really work.

But I can confirm that when I deploy my app with version 1.14.0 my app is broken.

[mnapoli]

Right, 1.12.1 introduced support for /directory URLs but that was a side effect of switching from OAI to S3 static website hosting. With prior version that wasn't supported, as we didn't deploy with static websites enabled before.

I still think /directory/ should work though, can you confirm if it doesn't work?

That being said, I'm not against switching static-website back again to S3 website hosting -> since it was the case in 1.12.1 I'm guessing there will be no downside except #172, and #172 was fixed by introducing the single-page-app construct (this construct will not be impacted).

[tonivdv]

I still think /directory/ should work though, can you confirm if it doesn't work?

You are correct, the /directory/ does work. However /directory does not.

That being said, I'm not against switching static-website back again to S3 website hosting -> since it was the case in 1.12.1 I'm guessing there will be no downside except #172, and #172 was fixed by introducing the single-page-app construct (this construct will not be impacted).

I played around a bit and there is something very strange that I can't explain at the moment. When I deploy my app with version 1.12.1, I can see my web page when calling an url with /directory ...

However, when I deploy with 1.14.0, and I manually reconfigure everything exactly the way it is done with 1.12.1, it still refuses to show the page with /directory.

So I really don't understand what is still different underlying.