Use S3 website URL rather than REST endpoint

[clarkd]

When the plugin creates the CF distribution it uses the REST endpoint for the S3 bucket, this means you get XML style error pages and means you lose out on SSL offloading and HTML errors.

I.e. it currently configures CF to point at:

xxxxxxx-app.s3.amazonaws.com (REST endpoint)

Rather than the website endpoint:

xxxxxxx-app.s3-website-us-east-1.amazonaws.com (website endpoint).

Note the s3-website in the URL.

More info here: https://docs.aws.amazon.com/AmazonS3/latest/dev/WebsiteEndpoints.html

Is this behaviour configurable? Or have I overlooked something?

[benheymink]

Update - this only seems to occur if singlePageApp is set to true. Looks like the difference is between the following in index.js:

https://github.com/MadSkills-io/fullstack-serverless/blob/3550afabfc17066b0ce18dc56db34111a364f58a/index.js#L475

and the following from the resources.yml:

https://github.com/MadSkills-io/fullstack-serverless/blob/3550afabfc17066b0ce18dc56db34111a364f58a/lib/resources/resources.yml#L58

Any reason not to use the WebsiteURL rather than the DomainName from S3 for both cases?

[andrewphahn]

This is caused by singlePageApp : true, which uses the REST API for S3 as the origin in CloudFront. When using the API CloudFront will route any request that returns a 503 to /index.html, which is what you want for a single page app. With the S3 HTTP endpoint as the origin you loose this functionality.

What configuration is causing you to see an XML style error page? I would expect it would simply route the request to your configured error page.

[sourcier]

When I create an app with the following config:

service: musical-waffle

plugins:
  - fullstack-serverless

custom:
  fullstack:
    bucketName: frontend
    distributionFolder: build
    clientCommand: npm run build    
    errorDocument: index.html
    noConfirm: true
    singlePageApp: true

provider:
  name: aws
  runtime: nodejs12.x
  stage: ${opt:stage}
  region: eu-west-2
  profile: serverless

I get http 403 errors when I try to access the files in the bucket, if I change singlePageApp to false then it works correctly, my frontend is a React app.