pdfjs分片加载及部分文件加载失败问题记录

pdfjs分片加载及部分文件加载失败问题记录

1. Java服务端配置

分片加载的实现是基于 HTTP-RANGE，即服务端的文件接口必须实现了HTTP-RANGE。
服务端文件接口实现HTTP-RANGE，需要服务端添加响应头。具体实现参考：PDF.js实现按需分片加载pdf文件-包含前后端开发源码和详细开发教程。

2. PDF.js配置

pdfjs支持pdf分页操作，无需单独再行添加js方法，找到view.js
下面展示一些 内联代码片。

1 　　　　　"disableAutoFetch": true, //是否禁用自动获取，true为禁用自动获取，开启分页
2         "disableFontFace": false,
3         "disableRange": false, //是否禁用range获取文件，false表示支持分页请求头
4         "disableStream": true, //分页关键，是否禁用流的形式加载

1234

3. 总结

完成上边的配置就可以实现pdf的分片加载，若需调整分片大小，在pdf.js文件中搜索 DEFAULT_RANGE_CHUNK_SIZE 进行调整，默认比较小一般设置为：

const DEFAULT_RANGE_CHUNK_SIZE = 65536*16;//*16即分片为1M

1

当我完成修改后，大部分的文件都是可以正常通过分片加载的方式显示，少部分的文件总是显示失败，换回一次性加载又是正常的，文件也是正常的，查看接口发现分片请求只发送了第一次和最后一次，中间的分片请求都丢失了，中间排查前端、nginx发现都没什么问题，只是提示响应的流长度与Content-Length的长度不匹配，最后看了后端的代码，怀疑是响应流的问题，加上了 flush() 方法后，所有的文件就正常了。