Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Investigating usage with authentication (Cognito) and Cloudfront #101

Open
lawrence-c opened this issue Jun 17, 2020 · 2 comments
Open

Investigating usage with authentication (Cognito) and Cloudfront #101

lawrence-c opened this issue Jun 17, 2020 · 2 comments

Comments

@lawrence-c
Copy link

lawrence-c commented Jun 17, 2020 •
edited
Loading

Hi,

So I've been looking at trying to use this with a private bucket behind cloudfront, and where a user needs to login to access the content in the bucket.

Current workflow:

  1. Followed this blog post: https://aws.amazon.com/blogs/networking-and-content-delivery/authorizationedge-using-cookies-protect-your-amazon-cloudfront-content-from-being-downloaded-by-unauthenticated-users/ which includes a cloudformation template which I ran. I removed all the HTTPHeaders in the template at setup for now while testing. This setup the default Cognito pool for authentication, and included an S3 bucket with a react app.

  2. I replaced everything in the created bucket, with the index.html and list.js from this repository and updated the index.html with something along the lines of:

<!DOCTYPE html>
<html>
<head>
  <title>S3 Bucket Listing Generator</title>
</head>
<body>
  <div id="navigation"></div>
  <div id="listing"></div>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">
  var BUCKET_URL = 'https://s3.us-east-1.amazonaws.com/<bucket_name>';
  var BUCKET_WEBSITE_URL = 'https://<cloudfront_url>.cloudfront.net';
</script>
<script src="list.js"></script>
</body>
</html>
  1. Navigating to the Cloudfront URL prompts the login screen (which I login with the details set from step 1), and on success, gets to the website, but gives the Error: [object Object], because it cannot access the bucket (console error being: https://s3.us-east-1.amazonaws.com/<bucket_name>?delimiter=/ 403 (Forbidden)).

I've also tried different variations within the index.html file, eg:

  • Updated the index.html to only include var BUCKET_URL = 'https://<cloudfront_url>.cloudfront.net'; which seemed promising at first post login, however it doesn't manage to list any of the files in the private S3 bucket, eg:

Screenshot 2020-06-17 at 15 41 05

There also isn't an error generated in the console. Something interesting in this scenario however, is that if I navigate to a known file (eg a hello-world.txt file in the web browser, so: https://<cloudfront_url>.cloudfront.net/hello-world.txt), I am able to see the file contents just fine in the web browser.

I'm unsure how to proceed here, as it seems the issue is although the user can access the index.html post authentication, the list.js uses the bucket link to access the bucket, which is inaccessible.

Any advice looking to proceed would be greatly appreciated!

Thanks :)

Related issues:
@lawrence-c lawrence-c mentioned this issue Jun 18, 2020
Open
@melnur
Copy link

melnur commented Nov 18, 2021

I appreciate if anyone can share possible solution for running this with Cloudfront & Cognito. In my case, it I can't see the bucket contents in explorer view. Thanks in advance,

image

@Dhyanesh97
Copy link

I appreciate if anyone can share possible solution for running this with Cloudfront & Cognito. In my case, it I can't see the bucket contents in explorer view. Thanks in advance,

image

I am trying to achieve the same.

  1. static s3 website (public bucket) : https://github.com/qoomon/aws-s3-bucket-browser
  2. setup cloudfront
  3. setup congnito with lambda@Edge : https://medium.com/@saurishkar/setting-up-aws-http-authentication-on-cloudfront-s3-using-cognito-and-lambda-edge-166ee38d471e

Facing few issues and looking for possible solution. After authenticating with cloudfront URL not able to load the web page due to below issue.

Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@lawrence-c @Dhyanesh97 @melnur