REACT PDF：无法使用包显示静态 PDF 文件
REACT PDF: Cannot use the packages to show static PDF file
我正在尝试在 React 应用程序中显示静态 pdf。我尝试了很多套餐：
react-pdf
react-pdf-js
react-pdf-js-无限
简单-react-pdf
pdfjs-dist
react-pdf-页数
他们经常说我们可以很容易地使用 URL 或 pdf 文件作为 PDF 组件的道具，但我不能使用。
我有两个主要错误。
因为我想使用 myPDF 作为组件的道具，所以我这样写：
从 'path/to/pdf_file' 导入 myPDF;
然后，render_some_component pdf:{myPDF}
这是错误：
ModuleParseError 在
模块解析失败：意外标记 (1:0)
您可能需要一个合适的加载器来处理这种文件类型。
（此二进制文件省略了源代码）
（当我评论那行时，这种错误就消失了）
我在webpack配置中使用了file-loader，我尝试了很多不同的方法但都失败了。
道具我直接用pdf文件是这样的：
render_some_component pdf:{'path/to/pdf_file'}
- 在控制台中：
警告：设置假工人。
11:23:55.962 pdf.worker.js:349 警告：忽略十六进制字符串中的无效字符“33”
11:23:55.963 pdf.worker.js:349 警告：忽略十六进制字符串中的无效字符“79”
...
有很多这样的 'Ignoring invalid character'，它总是以：
结尾
localhost/:1 未捕获（承诺）InvalidPDFException {名称："InvalidPDFException"，消息："Invalid PDF structure"}
- 在网络中，Headers，我看到：
请求URL:http://localhost:3000/myPdfFile.pdf
请求Method:GET
状态Code:200正常
远程Address:127.0.0.1:3000
- 但在网络响应中，我只看到 HTML 布局。
我认为 pdf 文件已正确加载，但程序包无法识别其 PDF 结构。
除了两个主要错误，我还有一个与包中使用的 Worker 相关的错误，但我不知道如何修复它：
未捕获的 DOMException：构造失败 'Worker'
（这与Chrome有关，因为人们说Chrome不允许在本地服务器中使用Worker）
非常感谢任何帮助，因为我已经在 4 天内陷入困境。
能否请您说明一下您的主要任务是什么？
如果我没有理解错的话，您想显示一个已经存在于您的应用程序的一部分中的 PDF 文件吗？您不想使用 JavaScript 创建新的 PDF。
如果您只想显示 PDF，您是否尝试过使用 iframe？
像这样：
<iframe
title="file"
style={{ width: '100%', height: '100%' }}
src={downloadURL}
/>
您也可以在此处使用从组件所在位置到文件的相对路径，或使用文件的完整 URL。
我正在尝试在 React 应用程序中显示静态 pdf。我尝试了很多套餐：
react-pdf
react-pdf-js
react-pdf-js-无限
简单-react-pdf
pdfjs-dist
react-pdf-页数
他们经常说我们可以很容易地使用 URL 或 pdf 文件作为 PDF 组件的道具，但我不能使用。
我有两个主要错误。
因为我想使用 myPDF 作为组件的道具，所以我这样写：
从 'path/to/pdf_file' 导入 myPDF;
然后，render_some_component pdf:{myPDF}
这是错误：
ModuleParseError 在 模块解析失败：意外标记 (1:0) 您可能需要一个合适的加载器来处理这种文件类型。 （此二进制文件省略了源代码）
（当我评论那行时，这种错误就消失了）
我在webpack配置中使用了file-loader，我尝试了很多不同的方法但都失败了。
道具我直接用pdf文件是这样的：
render_some_component pdf:{'path/to/pdf_file'}
- 在控制台中：
警告：设置假工人。
11:23:55.962 pdf.worker.js:349 警告：忽略十六进制字符串中的无效字符“33”
11:23:55.963 pdf.worker.js:349 警告：忽略十六进制字符串中的无效字符“79”
... 有很多这样的 'Ignoring invalid character'，它总是以：
结尾localhost/:1 未捕获（承诺）InvalidPDFException {名称："InvalidPDFException"，消息："Invalid PDF structure"}
- 在网络中，Headers，我看到：
请求URL:http://localhost:3000/myPdfFile.pdf
请求Method:GET
状态Code:200正常
远程Address:127.0.0.1:3000
- 但在网络响应中，我只看到 HTML 布局。
我认为 pdf 文件已正确加载，但程序包无法识别其 PDF 结构。
除了两个主要错误，我还有一个与包中使用的 Worker 相关的错误，但我不知道如何修复它：
未捕获的 DOMException：构造失败 'Worker'
（这与Chrome有关，因为人们说Chrome不允许在本地服务器中使用Worker）
非常感谢任何帮助，因为我已经在 4 天内陷入困境。
能否请您说明一下您的主要任务是什么？ 如果我没有理解错的话，您想显示一个已经存在于您的应用程序的一部分中的 PDF 文件吗？您不想使用 JavaScript 创建新的 PDF。
如果您只想显示 PDF，您是否尝试过使用 iframe？
像这样：
<iframe
title="file"
style={{ width: '100%', height: '100%' }}
src={downloadURL}
/>
您也可以在此处使用从组件所在位置到文件的相对路径，或使用文件的完整 URL。