uni-app 微信小程序支付宝小程序（alipay）百度小程序（baidu），预览pdf(链接和base64) 及下载（仅微信），window.open uni.downloadFile

废话不多说直接上代码吧

之前搜了一大堆有的没的，最终还是小伙伴巴拉文档一起找到的方案（离不开小伙伴的帮助，自己总容易陷入死局，在此鸣谢疾风李青！）；

想起个事：一定要给这些路径的域名配到相应的开发管理上，其他平台不过多赘述了

首先是预览，由于我这里是uni-app框架开发三端，所以展示内容开头以uni为主：
如果你的dpf是链接形式形如：https:// ，那么下面方案适合你(该方案，是小程序中的window.open的实现。)

支付宝不同机型调用uni.downloadFile 发现会发现有多种形式的文件路径，因此条件编译一下（纯他么坑爹）

const times = new Date().getTime();
let userPath = '';
// #ifdef MP-ALIPAY
userPath = my.env.USER_DATA_PATH;
// #endif
// #ifdef MP-WEIXIN
userPath = wx.env.USER_DATA_PATH;
// #endif
// #ifdef MP-BAIDU
userPath = swan.env.USER_DATA_PATH;
// #endiflet filePath = userPath + '/' + times + '.pdf';export default (url) => {uni.downloadFile({ // 下载url, // 服务器上的pdf地址filePath,success: (res) => {let openDocumentPath = filePath;// #ifdef MP-ALIPAYopenDocumentPath = res.tempFilePath || res.filePath || filePath;// #endifuni.openDocument({fileType: 'pdf',showMenu: true,filePath: openDocumentPath,success: () => {console.log('打开PDF成功')},fail: (err) => {uni.showToast({title: '打开文档失败，请重试！'})}})}})
}

如果你的链接是base64，那么这个方案适合你

const times = new Date().getTime();
let userPath = '';
// #ifdef MP-ALIPAY
userPath = my.env.USER_DATA_PATH;
// #endif
// #ifdef MP-WEIXIN
userPath = wx.env.USER_DATA_PATH;
// #endif
// #ifdef MP-BAIDU
userPath = swan.env.USER_DATA_PATH;
// #endiflet filePath = userPath + '/' + times + '.pdf';export default (data) => {const fileSystemManager = uni.getFileSystemManager(); fileSystemManager.writeFile({//保存本地临时路径filePath,data,encoding: 'base64',success: (res) => {uni.openDocument({fileType: 'pdf',showMenu: true,filePath,success: function (res) {console.log('打开PDF成功')},fail(err) {uni.showToast({title: '打开文档失败，请重试！'})}})}})
}

总结:
主要思路还是通过不同的api将文件先下载到小程序存储，通过uni.openDocument去打开，

配置相应服务器域名。
使用对应小程序api预览。

下载：
仅微信安卓端可实现，
uni.openDocument 打开 showMenu: true,
其实就是微信预览的时候，开启menu，通过右上角的三个点点击后保存到手机。

看到其他大牛给到的方案，都不是很完美，贴个链接吧。

微信小程序下载文件，保存文件功能总结

通过base64或pdf链接转 png后，再fileSystemManager.saveFile API保存文件为图片格式;
下载，完事让用户自己改后缀。
先使用下载文件api把文件下载下来，再使用wx.openDocument() 打开文件里面加上showMenu字段，然后就可以看到在打开的文件右上角出现了，
ios表现：ios点击之后会有发送给朋友的选项，选择分享给朋友之后就可以把文件直接发送给对方了，然后你就可以在聊天记录里面拿到这个文件；

这两种方式都不是很完美，所以小程序端暂时不建议提供下载功能，
除非给个链接让用户沾出去从浏览器下载。

uni-app 微信小程序支付宝小程序（alipay）百度小程序（baidu），预览pdf(链接和base64) 及下载（仅微信），window.open uni.downloadFile相关推荐

1000套微信小程序源码源代码带后台带运行截图预览图学习资料网盘下载
1000多套微信小程序源码带后台+教程+不同行业的源码集合 o2o行业 | - 盒马鲜生 | - 轻客洗衣互联网行业 | - 云文档 | - 仿ofo共享单车 | - 仿美团外卖 | - 仿饿了么 ...
uni-app 微信小程序使用 web-view 预览PDF
1.使用uni-pp开发微信小程序,上线之后发现Android手机无法加载览PDF,但ios可以.这里运用了 uni.openDocument <template><view cla ...
小程序图片上传php后台,微信小程序图片选择、上传到服务器、预览（PHP）实现实例...
微信小程序图片选择.上传到服务器.预览(php)实现实例小程序实现选择图片.预览图片.上传到开发者服务器上后台使用的tp3.2 图片上传请求时候的header参考时可以去掉(个人后台验证权限使用 ...
php 点击选择图片上传,微信小程序图片选择、上传到服务器、预览（PHP）实现实例...
微信小程序图片选择.上传到服务器.预览(PHP)实现实例小程序实现选择图片.预览图片.上传到开发者服务器上后台使用的tp3.2 图片上传请求时候的header参考时可以去掉(个人后台验证权限使用 ...
记录一次微信小程序实现预览pdf
微信小程序预览pdf需要注意的是,在安卓端和ios端是有差异的. 安卓端不能用web-view直接打开,需要先下载到本地,再打开文件进行预览. 网上说的ios端可以直接用web-view进行预览,但是 ...
【预览pdf】:uniapp在微信小程序预览pdf，兼容安卓/IOS
前言提示:因最近项目需求,项目需要用uniapp来开发微信小程序预览pdf的功能, 后端以链接形式返回pdf地址. 一.方法概述开始用uniapp提供微信自带方法:wx.downloadFile( ...
解决uniapp开发微信小程序预览pdf文件ios\安卓兼容问题
问题项目需要用uniapp来开发微信小程序,其中,有一个功能是预览pdf, 后台以链接形式返回pdf地址,一开始使用web-view做链接跳转,但是出现ios文件可以正常打开,android打不开的 ...
微信小程序saveFile，openDocument方法下载、预览pdf文件不能用本地应用打开（不能另存为）的问题
微信小程序saveFile,openDocument方法下载.预览pdf文件不能用本地应用打开(不能另存为)的问题查看官方文档的openDocument()方法,发现加一个showMenu: tru ...
微信小程序之wx.request:fail错误，真机预览请求无效问题解决，安卓,ios网络预览异常
微信小程序之wx.request:fail错误,真机预览请求无效问题解决,安卓,ios网络预览异常参考文章: (1)微信小程序之wx.request:fail错误,真机预览请求无效问题解决,安卓,i ...

uni-app 微信小程序支付宝小程序（alipay）百度小程序（baidu），预览pdf(链接和base64) 及下载（仅微信），window.open uni.downloadFile

uni-app 微信小程序支付宝小程序（alipay）百度小程序（baidu），预览pdf(链接和base64) 及下载（仅微信），window.open uni.downloadFile相关推荐

最新文章

热门文章

uni-app 微信小程序 支付宝小程序（alipay） 百度小程序（baidu），预览pdf(链接和base64) 及下载（仅微信），window.open uni.downloadFile

uni-app 微信小程序 支付宝小程序（alipay） 百度小程序（baidu），预览pdf(链接和base64) 及下载（仅微信），window.open uni.downloadFile相关推荐

最新文章

热门文章

uni-app 微信小程序支付宝小程序（alipay）百度小程序（baidu），预览pdf(链接和base64) 及下载（仅微信），window.open uni.downloadFile

uni-app 微信小程序支付宝小程序（alipay）百度小程序（baidu），预览pdf(链接和base64) 及下载（仅微信），window.open uni.downloadFile相关推荐