本文目录一览：
- 1、vue-pdf.js 在线预览问题
- 2、jspdf如何隐藏某个元素生成pdf
- 3、umijs@use-request源码解读
- 4、如何创建pdf的buffer，让pdf.js实现预览pdf文件
- 5、jspdf源码哪里有对高度进行限制
vue-pdf.js 在线预览问题
最近修改公司vue项目中使用pdf.js来实现在线预览上传的各类文件.由于使用pdf.js在预览时是直接在标签内将src属性赋值为要请求的地址.这就导致一个问题,会直接请求服务器的文件路径地址,而这个服务器文件路径就会暴露出来。处于安全性考虑在预览请求时不再返回地址，改为通过调用普通接口,而是统一返回流（word,pdf）或者base64(jpg,png...)。.前端再进行解析并实现在线预览.
此时遇到第一个问题：
这个请求是在插件中进行的无法携带项目中封装的各类请求头信息（token..等）。 翻看pdf.js源码及网上总结.发现一个底层方法
该方法可传一个对象作为参数,对象内可以添加url(所请求的接口),headers(请求头信息)等.... . 有了这个方法就好处理了.
最后在将该方法当做变量赋值给pdf的src.大功告成.
最后再补充一些 : @loaded="docLoaded" @page-loaded ="pageLoaded" 这两个方法为加载预览文件时的loading事件,
最后引一波示例,
jspdf如何隐藏某个元素生成pdf
jspdf隐藏某个元素生成pdf在id上切换来解析该项。就是把html内容转成canvas，然后生成图片，把图片添加到jspdf里，保存导出pdf优点:生成的pdf清晰度良好，且支持中文字体。
umijs@use-request源码解读
涉及ts的变量声明、接口、类、函数、泛型等
ts语法知识
前提：定义了一个 Fecth 类，用于处理请求数据。
1）用法
2）源码分析
第一次调用时，缓存中不存在数据，则会自动执行获取数据
1）用法
2）源码分析
当开启 manual 禁止自动请求时，将 run 函数暴露给用户调用。
如果 fetchKey 不存在，则新建 Fetch 实例，保存到 feches 对象中，并调用实例的 run ，最后返回调用结果数据。
如果 fetchKey 存在，则直接调用 Fetch 实例的 run 。
作用：在取数结束后设定 setTimeout 重新触发下一轮取数。
1）用法
2）源码分析
在 Fetch 类中 _run(...args: P) 的实际取值函数中，最后会判断，是否设置了轮询 pollingInterval ，设置了则开启定时器。 注意，前提是当前页面没有被隐藏。
定时器及时销毁：在 _run 函数最开始，会对现有的定时器先进行销毁。
作用：设置 options.cacheKey 后开启对请求结果缓存机制，下次请求前会优先返回缓存并在后台重新取数。
1）用法
2）源码分析
每次请求都是创建一个 Fetch 实例，并用 fetchKey 进行唯一标识，并且调用 run 函数时，优先调用缓存实例。
1）用法
2）源码分析
根据传入的 config 配置来判断是否进行防抖和节流分发处理。
1）用法
2）源码分析
预加载本质是缓存机制，通过利用 useEffect 同步缓存实例, 保证缓存数据的最新，然后当需要用到数据时，优先调用缓存实例。
1）用法
2）源码分析
1）用法
2）源码分析
调用 mutate 传入的方法
分页：设置 options.paginated 支持分页场景
加载更多：设置 options.loadMore 支持加载更多的情况
分页和加载原理：在 useAsync 这个基础请求 hook 基础上再包一层 hook ，扩展取数参数与返回结果。
所以，不在此处多余赘述了。
document.visibilityState ：表示下面 4 个可能状态的值
hidden ：页面在后台标签页中或者浏览器最小化
visible ：页面在前台标签页中
prerender ：页面在屏幕外执行预渲染处理 document.hidden 的值为 true
unloaded ：页面正在从内存中卸载
visibilitychange 事件：当文档从可见变为不可见或者从不可见变为可见时，会触发该事件。
函数返回值只会在组件的初始渲染中起作用，后续渲染时会被忽略
分析：对于同一个实例，可能出现多次调用 _run 方法，导致 this.count 和 currentCount 出现数据不同步的情况，比如，第一次调用 _run 后，刚好执行“关键点 闭包取数”后，还未执行到 return , 又执行了 _run ，导致此时 this.count+=1 ，那么第一次调用 _run.currentCount 的值比当前的 this.count 小1。
作用：保证 state 中的数据是最近一次访问接口得到的数据
源码github地址
用法地址
精读《@umijs/use-request》源码
如何创建pdf的buffer，让pdf.js实现预览pdf文件
pdf.js VS 传统浏览器读取pdf
一般来说，PDF档案格式都是在浏览器中由外挂程式来描绘，通常是Adobe自己的PDF reader或来自其他供应商的描绘工具，但这些外挂通常无法充分运用PDF的特点，而且由于含有大量的受信任代码，使得Google Chrome浏览器必须运用SandBox沙箱原理，来检查PDF描绘工具是否遭到未知病毒感染。
使用adobe，必须在本地安装软件才能使用，而pdf.js不依赖环境、渲染速度快（测试过，确实很快）、安全性高。
pdf.js渲染PDF文件
pdf.js渲染PDF文件的流程：Fetch pdf (url / buffer) —— canvas —— 渲染
如果要深入pdf的渲染，需要去研究pdf.js源代码。pdf.js可通过pdf文件的地址或pdf数据流获取pdf，具体实现是调用接口函数 PDFJs.getDoc(url/buffer)将pdf载入html，通过canvas处理, 然后渲染pdf文件。网上给出的都是通过url来获取pdf的例子，而我在做项目的时候，后台（python）要求是发pdf的数据流给前台，前台接收pdf的buffer,然后通过pdf.js来渲染。当然最初尝试buffer出现了很多问题，具体问题总结如下：
1）如何通过$.ajax接收后台发给前台的buffer数据；
2）如何将buffer传给pdf.js来处理（这里我使用了viewer.js, 所以需要考虑的是如何将buffer传给viewer.js来处理）；
3）如何将pdf.js转换成pdf.js可以接收的buffer格式；
（对应问题解决见代码注释）
注：viewer.js是pdf.js的扩展，其将打印、翻页、缩放等功能进行了实现，且界面非常好看。也就是说如果你引入了viewer.js，pdf的渲染和渲染之后的功能界面都已经帮你实现了，你不用自己去写界面。
jspdf源码哪里有对高度进行限制
首先用极速PDF编辑器打开PDF文档后，选择编辑器右上角“文档”选项卡中的“页面”并选择“调整尺寸”进入设置页面。
另外如需手动输入可以在新尺寸中勾选“自定义”，并输入宽度和高度的数值后，在单位的下拉选项中选择合适的数据单位即可。
