0

I'm currently building a react project, which is embeds small, static applications that are uploaded to an S3 bucket.

Those applications all are built using HTML/CSS/Vanilla JS, meaning they all have the same structure with an index.html file as an entry point.

Embedding those applications on the site through an iframe with the source link to the index.html works well, but I now want to make sure only users, who are registered and have the correct access rights have access to a given application.

Originally I wanted to handle this using pre-signed urls, but this doesn't seem to work since I couldn't find a way to use a pre-signed url to get access to all the files in a folder in S3.

I then thought about handling everything in React/Express, by making sure the user is authenticated, has the correct role and only then sending the src link back to the Frontend, where it gets embedded in the iframe. Additional I would add a bucket policy that only allows my specific domain to fetch the resources.

Apparently (from other threads) I saw that it's easy to spoof the HTTP referrer, meaning that if somebody gets the access link to the application on S3 they could simply send an HTTP request with a spoofed referrer and get their hands on the content.

I'm in over my head here and trying to figure out what the best architecture is. If it's something completely removed from the setup I currently have I'm happy to change it all around.

Generally though I would hope for something that just gives me an added layer of security, that makes it impossible to access the content in the S3 bucket unless it's coming directly from one specific host after authenticating there.

John Rotenstein
  • 241,921
  • 22
  • 380
  • 470
Nickfis
  • 168
  • 12
  • One (very) basic auth option is described [here](https://stackoverflow.com/questions/55874983/basic-user-authentication-for-static-site-using-aws-s3-bucket). More complex solution [here](https://aws.amazon.com/blogs/networking-and-content-delivery/authorizationedge-how-to-use-lambdaedge-and-json-web-tokens-to-enhance-web-application-security/). – jarmod Feb 14 '22 at 18:15
  • Your approach of authenticating users in the backend, and then providing pre-signed URLs, is a good approach. If users are authenticated, why do you also need to check that they are coming from a specific domain? – John Rotenstein Feb 14 '22 at 20:27
  • jarmod, Thanks a lot for providing this! I was apparently looking for the wrong sort of approach, so I never found those threads. @JohnRotenstein, I discarded the possibility with presigned URLs because I couldn't figure out how to serve the whole application in an iframe through a presigned URL (since the index.html needs to load in other resources like stylesheets, images etc.). The domain approach was just another thing I was thinking about on how to set this up – Nickfis Feb 15 '22 at 10:00

0 Answers0