helpfulengineering / project-data-platform-ts

GNU Affero General Public License v3.0
1 stars 0 forks source link

CORS problem of the s3 buckets from the library.... #10

Closed RobertLRead closed 2 months ago

RobertLRead commented 2 months ago

This URL is public and works great:

https://s3.amazonaws.com/github-helpfulengineering-library

...but when called from AJAX within a page, it throws a CORS error:

project-data-platform-ts/:1 Access to fetch at 'https://s3.amazonaws.com/github-helpfulengineering-library' from origin 'https://helpfulengineering.github.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. Screen Shot 2024-04-23 at 5 32 53 PM

Here is the code:

   // This worked...
    var url = `https://s3.amazonaws.com/${albumBucketName}`;
    fetch(url)
  .then(response => {
    if (!response.ok) {
      throw new Error('Network response was not ok');
    }
    return response.text();
  })
  .then(data => {
    console.log(data); // Do something with the content of the file
  })
  .catch(error => {
    console.error('There was a problem with the fetch operation:', error);
  });

I believe in S3 we may have to set a CORS rule. This reference suggests this:

https://docs.aws.amazon.com/AmazonS3/latest/userguide/cors-troubleshooting.html

I believe in our S3 configuration we need to set the "Access-Control-Allow-Origin" header on the response. I suggest it is safe to set this to "*" for our S3 bucket.