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

亲测有效!

这是在界面显示的样子

相关推荐
开开心心就好12 小时前
免费卸载工具,可清理残留批量管理启动项
linux·运维·服务器·windows·随机森林·pdf·1024程序员节
mysusheng14 小时前
2025年12月Z-Library电子书下载工具
pdf
vfvfb19 小时前
pdf转图片 每一页转成图片 pdf转jpg
pdf·pdf每一页转成图片
YJlio21 小时前
Python 一键拆分 PDF:按“目录/章节”建文件夹 + 每页单独导出(支持书签识别&正文识别)
开发语言·python·pdf
热河暖男1 天前
使用 Flying-Saucer-Pdf + velocity 模板引擎生成 PDF(解决中文和图片问题)
java·pdf·html·springboot
maogewang1 天前
清朝条约全集 PDF 电子版(三册合集):从尼布楚到辛丑,历史文献速存
pdf
maogewang2 天前
清朝条约全集 PDF 电子版(三册合集):从尼布楚到辛丑条约的完整史料集
pdf
木泽八2 天前
python实现pdf拆分与合并
服务器·python·pdf
江上清风山间明月2 天前
使用python将markdown文件生成pdf文件
开发语言·python·pdf
这儿有一堆花2 天前
确保 PDF 真实性:数字签名与文档加固技术深度解析
pdf