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

亲测有效!

这是在界面显示的样子

相关推荐
百事牛科技9 小时前
保护文档安全:PDF限制功能实操方法
windows·pdf
琪伦的工具库16 小时前
批量PDF文件加密工具使用说明:固定密码或随机密码批量加密PDF,权限控制+导出密码记录
运维·服务器·pdf
其实秋天的枫16 小时前
【26专四】英语专业四级TEM4历年真题及答案解析电子版PDF(2009-2025年)
经验分享·pdf
优化控制仿真模型16 小时前
26年初中中考英语大纲词汇1600个电子版PDF
经验分享·pdf
优化控制仿真模型16 小时前
【26专四】英语专业四级TEM4历年真题及答案电子版PDF(2009-2025年)
经验分享·pdf
一位代码16 小时前
python | 使用 pdfplumber 库提取 pdf 中的所有超链接
pdf
许彰午17 小时前
# Excel转PDF合并单元格边框错乱?jxl+iText逐格解析样式,政务报表精准还原方案
前端·javascript·pdf
Godson_beginner17 小时前
Aspose.PDF for Java(实现PDF转Word无水印无页数限制)
java·spring·pdf·文档转换
SEO-狼术2 天前
Infragistics now supports .NET 10
pdf·.net
琪伦的工具库2 天前
批量PDF合并工具使用说明:批量合并与直接合并两种模式,拖拽排序/页面范围/遍历子目录/重名自动处理
数据结构·pdf·排序算法