页面PDF文件格式预览(不使用pdf.js)

复制代码
<div id="pdfContainer"></div>

2.方法1

复制代码
var pdfUrl =downloadUrl; // 获取PDF的URL
var iframe = document.createElement('iframe'); // 创建iframe元素
iframe.src = pdfUrl; // 设置iframe的src属性为PDF的URL
iframe.style.width = '100%'; // 设置iframe的宽度和高度
iframe.style.height = '600px';
document.getElementById('pdfContainer').appendChild(iframe)

3.方法2

复制代码
var iframe = document.createElement('iframe'); // 创建iframe元素
iframe.src = pdfUrl; // 设置iframe的src属性为PDF的URL
iframe.style.width = '100%'; // 设置iframe的宽度和高度
iframe.style.height = '600px';
$.ajax({
    url: pdfUrl,
    type: 'GET',
    xhrFields: {
        responseType: 'blob'
    },
    success: function(data) {
        const blob = new Blob([data], { type: 'application/pdf' }); //重点
        const url = window.URL.createObjectURL(blob);
        document.getElementById('pdfContainer').src = url;
    }
});
相关推荐
G***E31613 分钟前
前端在移动端中的React Native Web
前端·react native·react.js
云烟飘渺o21 分钟前
JPA 的脏检查:一次“没 save() 却更新了”的排查记录
前端
Neptune125 分钟前
深入浅出:理解js的‘万物皆对象’与原型链
前端·javascript
阿迷不想上班25 分钟前
windows自动任务定期执行
javascript
王霸天29 分钟前
扒一扒 Vue3 大屏适配插件 vfit 的源码:原来这么简单?
前端
王霸天35 分钟前
拒绝 rem 计算!Vue3 大屏适配,我是这样做的 (vfit 使用体验)
前端
xinyu_Jina38 分钟前
ikTok Watermark Remover:客户端指纹、行为建模与自动化逆向工程
前端·人工智能·程序人生·信息可视化
盗德43 分钟前
最全音频处理WaveSurfer.js配置文档
前端·javascript
Heo43 分钟前
关于Gulp,你学这些就够了
前端·javascript·面试
Irene19911 小时前
web前端开发岗位就业前景和未来变化分析(附:AI技术如何进一步影响前端工作)
前端