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

这篇具有很好参考价值的文章主要介绍了微信小程序实现pdf预览(苹果安卓兼容)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

微信小程序实现pdf预览

1 使用web-view

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

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

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

此方法兼容苹果端和安卓端文章来源地址https://www.toymoban.com/news/detail-765517.html

//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()
      }
    })
  },

到了这里,关于微信小程序实现pdf预览(苹果安卓兼容)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • springboot+微信小程序实现文件上传下载(预览)pdf文件

    实现思路: 选择文件 wx.chooseMessageFile ,官方文档: https://developers.weixin.qq.com/miniprogram/d e v/api/media/image/wx.chooseMessageFile.html 上传文件 `wx,uploadFile` , 官方文档:https://developers.weixin.qq.com/miniprogram/dev/api/network/upload/wx.uploadFile.html 查看所有上传的pdf文件,显示在页面上 点击pdf文件

    2024年02月08日
    浏览(69)
  • uniapp实现h5、app、微信小程序三端pdf文件下载和预览

    以下代码兼容三端,app,h5,微信小程序,经过个人测试 手机端有两种方法,使用renderjs或者uniapp的api 两者的区别 使用renderjs的写法,会提示用户是否下载文件,下载完成后用户需要手动点击下载的文件,才会打开文件 使用uniapp的api则可以直接下载并直接预览,不需要用户操

    2024年02月11日
    浏览(54)
  • 微信小程序pdf预览

    2024年02月10日
    浏览(46)
  • 【uniapp】微信小程序中预览PDF

    开始用uniapp提供微信自带方法:wx.downloadFile({ }) + wx.openDocument({ }),但发现android正常打开,IOS打不开的情况 换种方式使用: web-view,uni-app 中web-view做链接跳转,但是出现IOS可以正常打开,android打不开的情况。 综上:安卓手机用原生,ios手机用web-view 1、android正常打开,IOS不

    2024年02月11日
    浏览(50)
  • uniapp 微信小程序 预览pdf方法

    效果图: 1、在小程序中 2、在H5中

    2024年02月15日
    浏览(52)
  • 微信小程序预览pdf(base64为)

    微信小程序转blob提示  !!! blob is not defined 查看官方文档后解释说微信小程序不支持转为 blob 采用官方解决方案:

    2024年02月12日
    浏览(55)
  • 利用PDF.js在微信小程序里预览PDF文件

    在微信小程序可以通过wx.downloadFile 和 wx.openDocument 两个api下载并打开pdf文件。这种方式主要有不少的缺点: 1、需要下载才可以查看,且每次打开都需要下载生成一个临时文件,如果PDF文件比较多的话,临时文件会越来越多,且如果PDF文件比较大的话,打开会比较慢。 2、在导

    2024年02月03日
    浏览(72)
  • 微信小程序打开PDF、word等文件预览

            近期在使用uniapp开发微信小程序时,碰到了要在小程序上打开PDF文件预览的需求,使用原生微信小程序开发的实现和这个也是类似的。实现大致代码如下:         这里主要用到了两个API:uni.downloadFile( ) 和 uni.openDocument( ),这两个API的功能如下: uni.downloadFile( ):发

    2024年02月14日
    浏览(156)
  • 你想要的PDF预览新方式,微信小程序绝对不容错过

    随着微信小程序的不断发展和变革,越来越多的功能被开发出来,其中预览 PDF 文件功能也已经成为小程序的常见应用之一。今天,我们将针对微信小程序预览 PDF 这一功能,为大家详细解析和介绍。 在小程序界面中添加一个按钮,并为其绑定一个点击事件; 在事件中调用

    2024年02月10日
    浏览(42)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包