PDF预览实现

**Personal Bolg**

1. hexo指令实现

• 安装hexo-pdf插件

• $ npm install --save hexo-pdf
  

• 使用时需要在 .md中引入

• <br>
  {% pdf /file(/source路径下文件夹)/a.pdf（pdf文件名称） %} s
  <br>
  

  实现效果如下

  
  
  s
  

2. pdf.js实现

将pdf.js引入hexo，使用iframe实现pdf预览，带有pdf注释工具

• 下载pdf.js，下载连接 https://github.com/mozilla/pdf.js

• 解压后，文件夹复制到根目录下/source文件夹中，同时创建/file存放pdf文件

• 在_config.yml中render掉pdfjs

• skip_render:
    - 'pdfjs/**/*'
  

• 使用时需要在 .md中引入

• <div> 
  <iframe src="/pdfjs/web/viewer.html?file=/file/b.pdf（文件路径同上）" width="100%" height="500px" frameborder="0"></iframe>
  <div> 
  

  实现效果如下

参考案例：Hexo中展示PDF文档 | 格物万象，究理天人 (fengzhenhua-vip.github.io)