Warning: getHexString - ignoring invalid character. Failed to load PDF file

[eugenestepaniuk]

Before you start - checklist

• I followed instructions in documentation written for my React-PDF version
• I have checked if this bug is not already reported
• I have checked if an issue is not listed in Known issues
• If I have a problem with PDF rendering, I checked if my PDF renders properly in PDF.js demo

Description

When downloading a pdf file, it appears warnings in console and Failed to load PDF file

https://codesandbox.io/s/react-pdf-example-6ikmdn?file=/pages/index.tsx

Steps to reproduce

1. Click Link 'Groups'
2. Select any item
3. On item page Failed to load PDF file

Expected behavior

Correct loading PDF File

Actual behavior

Failed to load PDF file

Additional information

No response

Environment

• Browser (if applicable): Chrome 103.0.5060.53
• React-PDF version: 5.7.2
• React version: 18.1.0
• Webpack version (if applicable):

[mynameisankit]

Have you tried using different text encodings, specifically base64? If nothing works, try preserving the Node.js object and manually convert it to uint array on the frontend and pass it.

[wojtekmaj]

In your code, you defined file="./software.pdf" which at URL https://idfkkf.sse.codesandbox.io/funds/1 points to https://6ikmdn.sse.codesandbox.io/funds/software.pdf which is not a valid PDF URL.

Correct URL would be file="/software.pdf" in this case.

Once you fix this, you'll be hit by another issue. You can't run React-PDF in SSR, as you can't really render canvas on the server side. So, to fix this, you'll need to asynchronously load React-PDF after mount (which happens only on browser side).