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

亲测有效!

这是在界面显示的样子

相关推荐
六元七角八分18 小时前
CSDN文章如何转出为PDF文件保存
开发语言·javascript·pdf
涔溪19 小时前
Vue 中实现 PDF 文件上传
javascript·vue.js·pdf
blog_wanghao20 小时前
PDF文件内容出现重叠现象解析
c++·pdf
2501_930707781 天前
使用C#代码在 PDF 中创建目录
pdf
随便叫个啥呢1 天前
java使用poi-tl模版+vform自定义表单生成word,使用LibreOffice导出为pdf
java·pdf·word
随便叫个啥呢2 天前
java使用poi-tl模版+vform自定义表单生成word,使用LibreOffice导出为pdf,批量下载为压缩文件
java·pdf·word·zip
CodeCraft Studio2 天前
国产化Word处理控件Spire.Doc教程:使用Java将RTF文件转换为PDF的全面教程
java·pdf·word·spire.doc·rtf转pdf·文件格式转换·文档开发sdk
CodeCraft Studio3 天前
国产化Excel处理控件Spire.XLS教程:使用Java将CSV转换为PDF(含格式设置)
java·pdf·excel·spire.xls·文档格式转换·csv转pdf
雾江流3 天前
WPS国际版18.22 | 集Word,PDF,Sheet,PowerPoint于一体的多功能免费办公套件
pdf·word·软件工程·wps
Jay_Franklin3 天前
Python中使用sqlite3模块和panel完成SQLite数据库中PDF的写入和读取
数据库·笔记·python·pycharm·sqlite·pdf·py