前言：
之前在使用Vue和其它框架的时候，预览 PDF 都是使用的 PDFObject 这个库，步骤是：下载依赖，然后手动封装一个 PDF 预览组件，这个组件接收本地或在线的pdf地址，然后在页面中使用组件的车时候，通过路由参数去获取目标PDF地址。
最近使用 Next.js 重构公司官网的时候，也碰到这个需求，用户协议是一个 PDF 文件，要求在页面中点击链接后能够预览 PDF。
因为之前有留意到某个 Next.js 的开源项目也有这个功能，于是果断抄作业。我本以为还是和往常一样，这个pdf预览的功能肯定依赖了某个三方库，但是我在这个开源项目的 package.json 中并未发现任何关于 pdf 依赖，我又怀疑作者是否在哪里注入了在线的三方库脚本，但是仔细翻看了一遍代码依旧没有找到任何蛛丝马迹。
只看到所有 pdf 文件被放在了 public/about文件夹中，然后在页面中是这么使用的:
<a target="_blank" className="btn" href="/about/fl.pdf" >About </a>
<a target="_blank" className="btn" href="/about/terms.pdf">Terms </a>
难道在Next.js中直接访问 public 文件夹中的 pdf 文件就可以在线预览 PDF 吗 ？
我立刻在项目中试了一下，还真是！！！所以在 Next.js 中使用 PDF 预览就变得简单多了，不再需要任何三方依赖了。文章来源：https://www.toymoban.com/news/detail-812192.html
文章来源地址https://www.toymoban.com/news/detail-812192.html
到了这里，关于无需任何三方库，在 Next.js 项目在线预览 PDF 文件的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
