微信小程序实现pdf预览(苹果安卓兼容)

微信小程序实现pdf预览

1 使用web-view

javascript 复制代码
// fileUrl为pdf文件网络路径     https://----.pdf
<web-view src="{{fileUrl}}"></web-view>

出现问题:苹果端显示正常,但是安卓端显示不了,这是因为Android 默认的 WebView 控件并不直接支持显示 PDF 文件,所以就由一下方法来解决。

2 使用wx.downloadFile()在成功之后使用wx.openDocument()

此方法兼容苹果端和安卓端

javascript 复制代码
//urll为pdf文件网络路径     https://----.pdf
  previewPdf(urll) {
    const that = this
    let url = urll
    wx.showLoading({
      title: '加载中'
    });
    wx.downloadFile({
      url,
      success: ({
        tempFilePath: filePath
      }) => {
        wx.openDocument({
          filePath,
          fail: (err) => {
            console.log('这是打开报错值:' + err)
          },
          complete: () => {
            wx.hideLoading()
          }
        })
      },
      fail: (err) => {
        console.log('这是请求报错:', err)
        wx.hideLoading()
      }
    })
  },
相关推荐
zhangphil6 分钟前
Android系统如何把Bitmap通过RenderThread及GPU器件显示到屏幕
android
2501_9444241211 分钟前
Flutter for OpenHarmony游戏集合App实战之数字拼图滑动交换
android·开发语言·flutter·游戏·harmonyos
a31582380626 分钟前
Android编码规范(修订版)
android·代码规范
灵感菇_27 分钟前
Android OkHttp框架全解析
android·java·okhttp·网络编程
w***765528 分钟前
快速上手DCAT-Admin开发指南
android
技术摆渡人38 分钟前
专题二:【驱动进阶】打破 Linux 驱动开发的黑盒:从 GPIO 模拟到 DMA 陷阱全书
android·linux·驱动开发
汤姆yu43 分钟前
基于android的个人健康系统
android
2501_944526421 小时前
Flutter for OpenHarmony 万能游戏库App实战 - 关于页面实现
android·java·开发语言·javascript·python·flutter·游戏
开开心心_Every1 小时前
手机端课程表管理工具:支持课程导入自定义
python·游戏·微信·django·pdf·excel·语音识别
大大祥1 小时前
Android FFmpeg集成
android·ffmpeg·kotlin·音视频·jni·ndk·音视频编解码