线上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地址要先转为二进制.

亲测有效!

这是在界面显示的样子

相关推荐
优化控制仿真模型8 分钟前
【2026年6月最新】英语六级高频核心词汇1500个+历年真题PDF
经验分享·pdf
其实秋天的枫35 分钟前
【2026年6月最新】英语六级高频核心词汇1500个+历年真题PDF
经验分享·pdf
开开心心就好2 小时前
桌面图标乱了怎么办,一键恢复固定位置工具
运维·服务器·windows·pdf·excel·3dsmax·houdini
琪伦的工具库5 小时前
从Word/PDF/PPT/Excel批量提取图片:工具使用记录
pdf
asdzx675 小时前
使用 Python 将图片转换为 PDF (含合并)
前端·python·pdf
琪伦的工具库6 小时前
批量提取PDF指定页面为图片:参数配置与DPI选择指南
pdf
weixin_441003641 天前
2027徐涛《核心考案+优题库》电子版pdf
pdf
IT大师兄吖1 天前
paddleOcr 懒人整合包 添加pdf和图片转markdown 添加GPU支持
pdf
IT大师兄吖1 天前
PaddleOCR-VL-1.5 懒人整合包 支持PDF转MD 比PP-StructureV3更精准
pdf
AmyLin_20011 天前
【pdf2md-3:实现揭秘】福昕PDF SDK Python 开发实战:从逐字符提取到 LR 版面分析
开发语言·python·pdf·sdk·markdown·pdf2md