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.

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

Unable to load file from aws s3 pre signed URL #399

Closed
omitewary opened this issue May 8, 2019 · 8 comments
Closed

Unable to load file from aws s3 pre signed URL #399

omitewary opened this issue May 8, 2019 · 8 comments
Labels
question Further information is requested

Comments

@omitewary
Copy link

omitewary commented May 8, 2019

Hello Wojciech Maj,

I have gone through existing issues related to CORS. The domain I am requesting to has enabled CORS and has GET as well as POST in allowed method. I am still getting following error.
Screenshot 2019-05-08 at 9 42 54 PM

Now, here is what I am doing. I am basically fetching pre signed URL from aws s3 and then using this url in file props of Document.

In my network tab I see that in pre flight request allowed method is POST. However pdf.js uses GET to load PDF.

Screenshot 2019-05-08 at 9 50 05 PM

As you can see Access-Control-Request-Method: POST .
I tried sending httpHeader in file props as

<Document file= {{ url: 'URL',httpHeaders: {'Access-Control-Request-Method': 'GET', 
"Access- 
Control-Allow-Origin": "*"}, withCredentials: true }}
 onLoadSuccess={this.onDocumentLoadSuccess}
renderMode="canvas">
</Document>

But if I send like this then I am not seeing any pre flight request in network tab and CORS issue persist.

Thank you in advance!

@gabrielnoal
Copy link

I had the same issue.
I solved using html iframe tag instead of using react-pdf.

<iframe style={{ <add your style here> }} src={'https://s3-sa-east-1.amazonaws.com/......'}/>

@pat-schoeps
Copy link

We're having the same issue, the service worker and library initialize correctly but fail to load resources from a presigned url. These files can otherwise be loaded successfully.

@wojtekmaj wojtekmaj added help wanted Extra attention is needed question Further information is requested labels Jun 12, 2019
@MariuszKogut
Copy link

We came across this issue, using Azure BlobStorage and shared access signature.

@danpan1
Copy link

danpan1 commented Jun 28, 2019

Solved the problem by changing CORS policy in s3 bucket https://docs.aws.amazon.com/AmazonS3/latest/user-guide/add-cors-configuration.html
CORS policy should be

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>Authorization</AllowedHeader>
</CORSRule>
</CORSConfiguration>

@yilinjuang
Copy link

Looks like the same as #370
Adding CORS policy to s3 bucket works. Thanks @danpan1

@jonahallibone

This comment was marked as off-topic.

@clement-faure

This comment was marked as off-topic.

@wojtekmaj wojtekmaj removed the help wanted Extra attention is needed label Feb 19, 2021
@hwoo3303
Copy link

I had the same issue. I solved using html iframe tag instead of using react-pdf.

<iframe style={{ <add your style here> }} src={'https://s3-sa-east-1.amazonaws.com/......'}/>

thank you I've tried several methods, but this is the one that helped me the most. 👍👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

10 participants