PDF.js无法使用范围/流式PDF。

3

我们正在使用PDF的应用程序,但由于客户使用的PDF大小,我们遇到了缓存问题。决定尝试流式传输/使用范围请求来逐步下载PDF。

以下是我看到的内容:

accept-ranges: bytes
access-control-allow-credentials: true
access-control-allow-headers: Authorization, Content-Type, body, Content-Length, Accept-Ranges, Range
access-control-allow-methods: GET,POST,PUT,DELETE
access-control-allow-origin: http://example.test
access-control-max-age: 1000
cache-control: max-age=31536000
content-length: 185124353
content-type: application/pdf
date: Thu, 05 Dec 2019 14:03:42 GMT
etag: "some-etag-that-works-nicely"

因为我现在是在本地运行,所以有很多CORS。在考虑将其推送到开发环境之前,我认为我们已经添加了所有必需的头文件,使PDF.js能够检测到我们支持范围调用,但似乎无法正常工作。

当我深入研究PDFJS-dist/build/pdf.js文件的第23744行(v2.3.200)时,我看到了这个:

if (getResponseHeader('Accept-Ranges') !== 'bytes') {
 return returnValues;
}

这让我想到,也许getResponseHeader()是区分大小写的,在某些情况下,我无法让API以我们习惯的混合大小写形式响应其标头。因此,我决定对其进行一些修改,使其返回值为allowRangeRequests = true

这有点奏效,然后我看到了一个与上面相同的标头的200 OK(在本地工作时经过OPTIONS后应该被取消,但实际上没有),接着是一堆新的调用,带有增量的range: byte=0-65000等标头,看起来像这样:

REQUEST
range: bytes=0-65535
//...and other headers of course, omitted for brevity.

RESPONSE
accept-ranges: bytes
access-control-allow-credentials: true
access-control-allow-headers: Authorization, Content-Type, body, Content-Length, Accept-Ranges, Range
access-control-allow-methods: GET,POST,PUT,DELETE
access-control-max-age: 1000
cache-control: max-age=31536000
content-length: 65536
content-type: application/pdf

所以,这也为我提供了一个实际工作的PDF(或者至少是几页)的视图;因此,这表明它至少部分地起作用。

现在,为什么我需要“破解”这个,我缺少哪些头信息,以便让PDF.js检测到我们实际上支持范围,因为它似乎已经正确实现了?这是否也是导致它不会在没有range: bytes=0-65535的情况下取消初始获取的原因,因为另一个“范围支持检测”的部分呢?

2个回答

3
我们已经让它正常工作了。似乎PDFjs内部实现对头文件有很严格的要求。当您与CORS一起使用时(因此首先需要进行OPTIONS调用),它似乎根本没有获取到正确的头文件。这可能是一个错误,但我还没有花时间去调查并确定是否应该报告。
其次,HTTP2 SPDY协议使所有头文件都为小写,并且似乎PDFJS依赖的内部实现对大小写敏感的头文件很挑剔。当我们禁用HTTP2 SPDY并再次尝试而没有CORS时,我们成功地让它工作了,没有任何问题。

我使用了相同的源,从服务器中删除了access-control-allow-origin,但仍然存在的问题是,范围请求一直处于挂起状态,直到常规完整请求完成。 - Lior

3

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接