All I have to do is generate specific JSX and download it as pdf-file. I use react-to-pdf library and it works fine but it ignores images stored in AWS S3 bucket that are loaded fine in JSX img-component.
A full error looks like this:
Access to image at 'https://s3-eu-west-1.amazonaws.com/my-bucket/my-cool-image.png?ver=1663764527047' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Here is my Bucket policy:
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "PublicReadGetObject",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::my-s3-bucket/*"
},
{
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetBucketCORS",
"Resource": "arn:aws:s3:::my-s3-bucket"
}
]
}
And here is CORS settings:
[
{
"AllowedHeaders": [
"*"
],
"AllowedMethods": [
"HEAD",
"GET",
"PUT",
"POST",
"DELETE"
],
"AllowedOrigins": [
"*"
],
"ExposeHeaders": [
"x-amz-server-side-encryption",
"x-amz-request-id",
"x-amz-id-2",
"ETag",
"Access-Control-Allow-Origin"
],
"MaxAgeSeconds": 3000
}
]
I tried different CORS and Bucket policy configurations but none of them worked as expected.