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

亲测有效!

这是在界面显示的样子

相关推荐
输出的都是我的3 小时前
latex格式中插入eps格式的图像的编译命令
pdf
FreeBuf_17 小时前
微软365 PDF导出功能存在本地文件包含漏洞,可泄露敏感服务器数据
服务器·microsoft·pdf
熊出没1 天前
Vue前端导出页面为PDF文件
前端·vue.js·pdf
最懒的菜鸟1 天前
MinerU将PDF转成md文件,并分拣图片
人工智能·pdf
开开心心_Every2 天前
便捷的电脑自动关机辅助工具
开发语言·人工智能·pdf·c#·电脑·音视频·sublime text
用什么都重名2 天前
MinerU:高效智能PDF文档解析工具完全指南
人工智能·python·pdf·mineru·makedown
Xiaouuuuua2 天前
一个简单的脚本,让pdf开启夜间模式
java·前端·pdf
CHANG_THE_WORLD2 天前
字体 Unicode 区块字符展示 PDF 生成器
pdf·libharu
Gq.xxu2 天前
RAG实战之dify源码文件解析-pdf文件解析流程
开发语言·python·pdf
Kyln.Wu2 天前
【python实用小脚本-131】Python 实现 HTML 到 PDF 转换:解决文档处理痛点的高效工具
python·pdf·html