线上PDF文件展示

场景: 请求到的PDF(url链接),将其展示在页面上

插件: pdfobject (我使用的版本: "pdfobject": "^2.2.12" )

下载插件就不多说了,下面将其引入:

javascript 复制代码
<div id="pdf"></div>
javascript 复制代码
import PDFobject from "pdfobject";

这里的this.url 就是请求回来的pdf url地址

javascript 复制代码
  new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open("GET", this.url, true);
    xhr.responseType = "blob";
    xhr.onload = function () {
     if (this.status == 200) {
       resolve(this.response);
     } else {
       reject(this.statusText);
     }
   };
   xhr.onerror = function () {
    reject(this.statusText);
   };
   xhr.send();
 }).then((blob) => {
   PDFobject.embed(URL.createObjectURL(blob), "#pdf");
 });

这里的请求回来的url地址要先转为二进制.

亲测有效!

这是在界面显示的样子

相关推荐
开开心心就好11 小时前
自定义屏幕显示方向的实用软件
java·服务器·python·eclipse·pdf·word·excel
zhou周大哥14 小时前
word,ppt,pdf 转图片
pdf·word·powerpoint
一路向北North19 小时前
java对pdf文件分页拆分
java·开发语言·pdf
IDRSolutions_CN19 小时前
如何用Java拆分PDF文件(教程)
java·经验分享·pdf·软件工程·团队开发
inxunoffice1 天前
批量合并 PDF 文档,支持合并成单个文档,也支持按文件夹合并 PDF 文档
pdf
猿大师办公助手1 天前
Web网页内嵌福昕OFD版式办公套件实现在线预览编辑PDF、OFD文档
前端·pdf·word
qq_419854052 天前
pdfh5 pdf
pdf
inxunoffice2 天前
批量将 PDF 转换为 Word/PPT/Txt/Jpg图片等其它格式
pdf·word·powerpoint
安全方案2 天前
2025清华大学:DeepSeek教程全集(PDF+视频精讲,共10份).zip
pdf
小青柑-2 天前
LangChain 文档加载完全指南:从PDF到YouTube的多样化数据源处理
langchain·pdf