一、问题
背景
- PDF.js版本v2.4.0
- PDF.js版本v3.5.141
- 两个测试文件，一个600+kb（文件A），一个1.5mb（文件B）
现象
- 两个文件在2.4预览有问题
- 两个文件在3.5，文件A没有问题，文件B有问题
- 直接用WPS可以预览
- 直接拖入浏览器能够预览
正常预览是这样的（部分截图）：
可以看出，红色箭头处是有内容的。
异常预览是这样的（部分截图）：
可以看出异常了吧。
排查
因为2.4全都不好用，并且计划升级PDF.js版本，所以直接查3.5版本的代码。
因为文件A能够正常预览，文件B不行，所以先去观察这两次预览的输出有没有差异。
差异出现了，大致意思就是没有能够decode 图片，3.5版本在本文发表之前的一周更新了一个版本，3.5.120-3.5.141，更新了一些代码：
以上代码是更新的一部分，我从警告信息出发，定位到这里，createImageBitmap 方法出错，然后流程没有继续，就会出现上面所说的问题。
这里出的问题吗？我注释掉了这次更新的代码，并没有用。
Warning: Unable to decode image "img_p0_1": "InvalidStateError: The source image could not be decoded.".
这个报错还是有，但是，这里提醒我了，跟这次的代码更新没有关系，更多的原因是PDF.js将pdf转换成image之后出现的问题。
陷入困境
目前的信息：
- 不是120-141版本代码更新的问题，link
- 结合网络查询信息，可能是文件损坏
- 但是WPS能够正常预览
- 很大可能是转成image之后的问题
- ...
一线曙光
文件A与文件B，还有一个差异，那就是文件大小，他们都是一页，为啥有将近一倍的差异呢？ 这个文件大小应该跟文件内容有关系吧？我是这么想的。
那就试试！
打开一个最新发现的在线工具，免费的就能满足我现在的需要。但是有部分功能还是需要WPS搞...
充值吧～
改变文件内容：
- 裁剪文件内容
- 压缩
- 其他
结果：
- 裁剪 ❌
- 压缩 ✅
- 其他 ❌
我次奥？
也就是说，文件过大？
不对不对，我们项目能够预览一整本书呢，那个更大才对。
这个文件是单页的，那么也就是说，可能跟分辨率有关系？
因为分辨率所以转成的image会比较大？
仔细看代码提交记录，发现120-141更新的就是处理一部分因为image过大造成的问题。
说通了，虽然这个更新没能解决文件B的预览问题，但是能够辅助说明文件B压缩之后，能够预览这个现象。
文件B可能是因为分辨率过大，PDF.js处理时出现一些问题。
但是，如果说文件B对于PDF.js是损坏的，那么我用工具压缩之后，损坏被修复了，会不会有这种可能呢？
如果是，那么就是文件损坏的问题了....
结论
我没能解决这个问题，擦！
酒浆～
欢迎大家关注我的公众号：王大锤学前端
