uni-app

微信小程序——加载PDF

2021-09-18  本文已影响0人  ZT_Story

前言

一般情况下,我们在遇到pdf链接需要在客户端展示的时候,都会选择使用webview来加载。
但是Android的WebView默认没有内置pdf浏览器,iOS端是支持的
在客户端,我们可以考虑用插件来解决这个平台不一致的问题
那么在小程序端怎么处理呢?

现象

使用微信小程序提供的web-view组件访问pdf
iOS可以正常访问
Android会加载页面失败请重试

解决方案

1. 将pdf转换为html
PDF转HTML传送门
ps:这个网页可以在线帮我们完成转换,支持的程度还是非常高的,转换后的html可以完美还原pdf显示与功能。缺点就是文件会变多,体积会增大,首次渲染时由于下载资源的原因会比较慢

2. 使用下载并打开的方式来展示

   openFile(url) {
        if (!(url && url.length)) {
            return;
        }
        wx.showLoading("文件加载中...");
        wx.downloadFile({
            url: url,
            success: (res) => {
                if (res.tempFilePath) {
                    wx.openDocument({
                        filePath: res.tempFilePath,
                        fail: (err) => {
                            console.error(err);
                        },
                        complete: () => {
                            wx.hideLoading();
                        }
                    })
                }
            },
            fail: (err) => {
                console.error(err);
                wx.hideLoading();
            }
        })
    }

ps:这种方式双端一致性较好,都是用插件来加载pdf的,所以几乎不存在其他问题,而且还可以支持分享等功能,推荐这种方案统一双端

上一篇 下一篇

猜你喜欢

热点阅读