...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.
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:
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.
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](https://github.com/helpfulengineering/project-data-platform-ts/assets/5296671/1ad9f505-3926-4526-bc05-1a89f0e96a86)
Here is the code:
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.