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

李白咩2024-05-13 16:36

微信小程序实现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()
      }
    })
  },