使用来自web api 2的react-pdf加载PDF时出错,但是没有从文件系统加载PDF

时间:2018-03-29 15:19:25

标签: c# reactjs http pdf asp.net-web-api2

当我通过IIS从文件系统加载pdf时,react-pdf会显示pdf而不会出现问题。但是,当我尝试从Web服务加载它时,react-pdf会失败并引发错误。如果我直接在浏览器中点击服务URL,我可以看到PDF。

React-pdf会抛出以下错误:

Warning: Ignoring invalid character "104" in hex string
[Multiple warnings about invalid characters]
pdf.worker.js:349 
Warning: Indexing all PDF objects index.js:2178 
Invalid PDF structure InvalidPDFException {name:     "InvalidPDFException", message: "Invalid PDF structure"}
__stack_frame_overlay_proxy_console__ @ index.js:2178
consoleOnDev @ utils.js:172
errorOnDev @ utils.js:189
Document._this.onLoadError @ Document.js:142
Promise.catch (async)
Document._this.onSourceSuccess @ Document.js:119
Promise.then (async)
loadDocument @ Document.js:314
componentDidMount @ Document.js:231
commitLifeCycles @ react-dom.development.js:8770
commitAllLifeCycles @ react-dom.development.js:9946
callCallback @ react-dom.development.js:542
invokeGuardedCallbackDev @ react-dom.development.js:581
invokeGuardedCallback @ react-dom.development.js:438
commitRoot @ react-dom.development.js:10050
performWorkOnRoot @ react-dom.development.js:11017
performWork @ react-dom.development.js:10967
batchedUpdates @ react-dom.development.js:11086
batchedUpdates @ react-dom.development.js:2330
dispatchEvent @ react-dom.development.js:3421

当我通过fiddler比较http请求时,响应看起来几乎相同:

直接从文件系统加载pdf:

HTTP/1.1 200 OK
Content-Type: application/pdf
Last-Modified: Thu, 29 Mar 2018 13:08:34 GMT
Accept-Ranges: bytes
ETag: "abc7c8a5fc7d31:0"
Server: Microsoft-IIS/10.0
X-Powered-By: ASP.NET
Date: Thu, 29 Mar 2018 14:31:16 GMT
Content-Length: 118306

Api电话:

HTTP/1.1 200 OK
Cache-Control: no-cache
Pragma: no-cache
Content-Type: application/pdf
Expires: -1
Accept-Ranges: bytes
Server: Microsoft-IIS/10.0
Date: Thu, 29 Mar 2018 13:14:54 GMT    

fiddler中的内容看起来也一样。通过winmerge比较。还有什么可能会有所不同?文件编码?

使用react-pdf 3.0.2

return (
        <div>
            <div className={this.state.className}></div>
            <Document file={link} onLoadSuccess={this.onDocumentLoad} loading="">
                <Page pageNumber={pageNumber} />
            </Document>
            <p>Page {pageNumber} of {this.state.numPages}</p>
        </div>);

0 个答案:

没有答案