pdfH5.js执行成功但显示白屏原因

已于 2024-04-24 15:52:15 修改
阅读量1.1k 收藏 8
点赞数 6
文章标签： pdf 前端
于 2024-03-08 15:45:55 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weiweiweb888/article/details/136564073
版权
文章提到在处理Vue项目时，关闭mock等虚拟接口可以解决PDF加载时的白屏问题，同时建议检查`main.js`和`vue.config.js`中的相关配置，如`mockXHR`函数。

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

如图所示：

看看自己是否使用mock等虚拟接口工具。关闭mock等虚拟接口就可以解决pdf白屏问题。

检查mian.js 或 vue.config.js 看看是否有相关配置。

const { mockXHR } = require('../mock') //影响pdf加载
// mockXHR()  注释掉

weiweiweb888
关注
uniapp [移动端H5网页端] - 详细实现PDF预览功能在线预览PDF文档，Uniapp H5实现pdf文件预览在线预览pdf二进制文件流、本地pdf文档、PDF文件地址url路径（解决白屏报错
王二红
11-11 1万+
uni-app，h5网页，微信公众号网页开发，uniapp网页端，手机端H5公众号页面，uniapph5项目，uniapp在线预览pdf功能，在H5平台实现浏览器PDF的预览查看，uniapp手机h5端实现pdf文件预览，预览pdf白屏没有报错，打开后没反应，打开是空白，加载PDF时发生错误，如何做pdf预览，UNIAPP在线预览PDF文档，Uniapp在线预览pdf文件流，从后端接口里获取pdf文件如何转成链接预览，预览pdf的插件，uni-app的pdf预览功能，uniapp使用pdf.js插件预
pdfh5使用及不显示pdf文件原因
haoxinqing222的博客
03-27 5095
<!--适用于vue--> npm install pdfh5 安装 <!--使用--> <template> <div id="app"> <div id="demo"></div> </div> </template> <script> import Pdfh5 from "pdfh5"; export default { name: 'App', data() {
鸿蒙使用pdf.js加载pdf的方案和其定制化
m0_63548381的博客
05-24 3041
经过验证，点击pdf.js工具栏的打开按钮 ，然后通过web组件的onShowFileSelector方法可以监听到h5的input file，从而调起鸿蒙本机的文件管理器用于选择文件。这个项目的实现非常好，但是经过验证，这个基于pdf.js的项目只支持包内本地pdf和在线pdf链接。然后我首先通过runJavaScript方法调用在viewer.html的script标签里自定义的openFIle函数，企图把鸿蒙读取的文件对象直接传过去。但由于其功能和样式的自定义程度受限，所以这种方案目前的优先级不高。
uniapp h5本地预览pdf教程 （含白屏|跨域解决方案）
牛马程序员进阶之路
08-08 2486
uniapp h5本地预览pdf教程 | pdf.js使用教程 | pdf.js加载白屏处理方案 | pdf.js跨域处理方案
vue使用pdfh5.js插件，显示pdf文件白屏
最新发布
wangjie的博客
12-16 1135
pdfh5，展示文件白屏，无报错。 vue+pdfh5.js 预览pdf文件，显示白屏。
使用 html2canvas 和 jspdf 将页面转 pdf，同时解决当页面过长时，页面白屏问题
SiShen654的博客
10-07 3485
别人使用标签的方式来显示 base64，但是当页面过长时，base64 大小过大会导致页面解析异常，显示白屏。代码如下，直接粘贴复制即可，代码中 jspdf 是全局引入，你可以自己局部引入。
pdf.js 微信公众号不显示问题
qq345oo的博客
09-11 509
问题1： 在浏览器中能够正常显示， 但是在微信浏览器中不行！ 解决： 这个是pdf.js 版本问题， 用2.4版本，微信打开就没问题了 问题2： 如何关闭侧边栏？ 修改这个地方， 将 -1 改为 false
Vue实例的生命周期详解，从创建到销毁全过程
weixin_45745641的博客
12-31 2759
文章目录前言初识new VueVue实例从创建到销毁1.创建之前—beforeCreate()2.创建之后—created()3.实例对象和文档挂载之前—beforeMount()4.实例对象和文档挂载之后—mounted()5.视图更新前—beforeUpdate()6.视图更新后—updated()7.实例销毁之前—beforeDestroy()8.实例销毁之后—destroyed()总结 前言 Vue的生命周期一直以来都是重中之重，虽然在实际开发中经常用到的就几个，但是你对生命周期的掌握程度决定着你写
前端预览 文件 PDF 在 ios设备上的适配问题
laowangzia的博客
04-18 947
这两个版本是可以用的 但是在过程中 还是发现有问题 用 jsPDF 库合成的pdf文件在 ios 浏览器上还是白屏 目前看是因为 合成的pdf 文件可能 精度过高 或者 宽高超了 但是还不清楚从哪里下手。这个库，但是在使用的过程中 发现。想在PC和H5上预览各种文件 XSLS、PDF、PPT、DOCX。
h5端支付宝浏览器vue-pdf-embed显示空白
weixin_48198130的博客
06-27 570
原因：因为支付宝浏览器内核在某些情况下可能不支持ES6语法，这样导致最新版本的vue-pdf-embed不显示。问题：vue-pdf-embed我是安装的最新版本2.0.4。解决：下降到1.2.1版本就可以了。
解决WebView通过URL加载H5界面出现空白的问题
01-20
1.权限问题：在配置文件中需要设置网络权限 2.基本配置问题 WebSettings webSettings = webView.getSettings(); //支持缩放，默认为true。 .setUseWideViewPort(true); // 缩放至屏幕的大小 webSettings .setLoadWithOverviewMode(true); //设置默认编码 webSettings .setDefaultTextEncodingName(“utf-8
移动端vue3使用pdfjs在浏览器上面运行正常，在移动端页面报错出现空白页
qq_51463650的博客
04-16 1737
分享一下PDFjs文件包，真心好用。一开始我的浏览器页面一直白屏，显示空白，后来换了包之后就能正常预览PDF了。如上图所示， @click-preview="previewFile"是预览PDF的方法， accept=".png...." 是可以接收的文件类型，这个打开之后手机才可以上传PDF文件，里面值类型自选。
pdfh5.js 基于pdf.js和jQuery，web/h5/移动端PDF预览手势缩放插件。
当幸福来敲门的专栏
12-29 4323
pdfh5.js 基于pdf.js和jQuery，web/h5/移动端PDF预览手势缩放插件。 注意：本地绝对路径地址不能加载，跨域问题用代理或者服务端解决。 svg模式渲染存在缺陷，只能渲染普通pdf，带签名、印章的可能会渲染不全，报错，pdf.js官方目前没有给出解决方案 canvas模式本质是图片，默认进去的时候，图片在手机端被缩放，不是原分辨率，所以失真模糊。所以需要放大查看pdf pdfh5博客主页 pdfh5项目GitHub地址 react、vu
移动端H5使用pdf.js预览
m0_52769924的博客
04-17 1386
2.将下载的文件放进uniapp项目中。1.下载pdf.js文件。
android5.0加载h5页面显示空白
a_sid的博客
07-22 831
参考链接
vue-pdf使用及遇到的问题总结，ios使用vue-pdf会有白屏的bug
qq_41314448的博客
05-22 2014
vue-pdf使用及遇到的问题总结，vue-pdf-sign
手机端html5展示pdf,pdf.js移动端展示预览打开pdf-pdfh5.js
weixin_31461519的博客
06-11 4389
pdf.js移动端展示预览打开pdf-pdfh5.js本插件基于pdf.js和jQuery，可手势捏合缩放，支持懒加载(即分段加载)。2019.07.18更新：增加npm install pdfh5使用方式，适应于vue，使用方式和api见github2019.07.17更新：新增配置参数lazy，支持懒加载。2019.07.10更新：新增部分api，配置参数。内部渲染机制改动：先画canvas再...
uniapp 下载文件
Lv Sijun's blog
08-15 6128
直接上代码 toDownWord(item){ uni.showLoading({ title: '下载中' }) let abc = item.fileUrl.split('/') let name = abc[abc.length - 1]; //文件名称可以在上传时进行保存，下载时取出，当文件名称中存在单双引号时，要做好处理，否则会报错 //item.fileUrl 为线上文件下载路径 let dtask = plus.downloader.createDownload(
解决uni pdf.js 接口请求后台文件流显示白屏问题
weixin_49847526的博客
03-01 3052
解决uni pdf.js 接口请求后台文件流显示白屏问题pdf.js的使用这里不再多介绍了，直接奔向主题。但是我需要的是这个样子的结果就显示肯定是不行的。。。查阅资料修改代码参考文章 pdf.js的使用这里不再多介绍了，直接奔向主题。 场景介绍：文件管理系统，要求文档可以预览pdf，向后台请求拿到文件流。 网上查到的资料都是这个样子的 通过页面参数传值的方式加载pdf文件 file的值需要URLEncode编码 指向服务器端 例如： http://xxxxx.com:89/demo/fileupdown
vite.config.js 打包白屏
04-18
当项目在打包时出现白屏的情况，可能是由于以下几个原因导致的： 1. 路径配置错误：检查 vite.config.js 文件中的路径配置是否正确，特别是入口文件和静态资源文件的路径配置是否准确。 2. 缺少依赖：检查项目是否...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值