mozilla pdfjs跨域问题及压缩优化

本文介绍mozillaPDFJS插件解决跨域问题的方法及如何通过压缩pdf.worker.js来优化加载速度。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

#mozilla pdfjs介绍
moziila pdfjs是一款优秀的pdf在线预览、导出、打印插件,但在使用中遇到了跨域问题。

#mozilla pdfjs跨域设置
在pdf.js/web/app.js中,1420行,找到

let viewerOrigin = new URL(window.location.href).origin || 'null';
	  
//添加这一行    
//修改,将当前工程的origin纳入pdfjs的宿主域
HOSTED_VIEWER_ORIGINS.push(viewerOrigin);

if (HOSTED_VIEWER_ORIGINS.indexOf(viewerOrigin) >= 0) {
// Hosted or local viewer, allow for any file locations
return;
}

这样就是允许所有与本域名不同的请求,客户端js放开了限制,但是服务器端还需要配置CORS(cross origin resource share),请求是发送到腾讯云所以服务端设置可以参考这篇文档

#pdfjs文件过大
pdf.worker.js过大问题,下载pdfjs源代码,npm安装依赖后,使用gulp minified 命令压缩js,在build文件夹下生成minified文件夹就是压缩后的,未压缩前1M多,压缩后600多KB
这里写图片描述

#参考
https://github.com/mozilla/pdf.js
https://github.com/mozilla/pdf.js/issues/7153
https://github.com/mozilla/pdf.js/wiki/Frequently-Asked-Questions#can-i-load-a-pdf-from-another-server-cross-domain-request

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值