IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 移动开发 -> 微信小程序下载文件,保存文件功能总结 -> 正文阅读

[移动开发]微信小程序下载文件,保存文件功能总结


前言

总是有需求想在微信小程序里面做下载文件并保存的功能,所以自己整理了一下小程序涉及到下载api,大致理了下在小程序里面下载的流程和解决方案。


一、涉及api

1.wx.saveFile()

? 文档链接:https://developers.weixin.qq.com/miniprogram/dev/api/file/wx.saveFile.html

作用:保存文件到本地。

?注意:
1.该api调用的限制是下载文件最大为10m,且该接口已停止维护。
2.不支持保存后的文件转发,保存后的文件仅支持在小程序内使用。
3.保存的位置是在小程序缓存里面,开发者和用户不需要关心。

2.wx.downloadFile()

? 文档链接:https://developers.weixin.qq.com/miniprogram/dev/api/network/download/wx.downloadFile.html

作用:下载文件资源到本地。客户端直接发起一个 HTTPS GET 请求,返回文件的本地临时路径 (本地路径)。
注意:
单次下载允许的最大文件为 200MB。

3.wx.getFileSystemManager().saveFile()

文档链接:https://developers.weixin.qq.com/miniprogram/dev/api/file/FileSystemManager.saveFile.html

作用:微信文件管理对象,保存临时文件到本地。
注意:
1.FileSystemManager是微信小程序文件管理器,通过 wx.getFileSystemManager 获取,saveFile()是它提供的一个方法

4.api总结

以上三个api都不能实现真正意义的下载保存,因为微信小程序提供的存储服务是以小程序和用户维度隔离的存储服务,所以下载下来之后用户并不能访问到自己下载的文件。做不到用户下载文件之后可以快捷的找到下载的文件。只是下载到微信app的缓存里面。且微信也不建议开发人员或用户去查询本地文件存储的路径。该结论官方文档也有具体说明:
微信小程序本地文件关系图

文档链接:https://developers.weixin.qq.com/miniprogram/dev/framework/ability/file-system.html

二、解决方案

基于以上问题,有以下可实行的解决方案

1.方案一

使用wx.downloadFile() 下载对应文件后,使用fileSystemManager.saveFile API保存文件为图片格式;保存成功后,再使用wx.saveImageToPhotosAlbum保存到相册,然后这个时候我们给出弹窗提醒让用户跑到相册文件中找到对应的文件重命名改掉文件格式。

缺陷:这种方式对iOS某些机型系统不兼容。具体我也没去试,因为后续没有使用该方案。

代码:因为我是用uniapp写的案例,所以代码是这样的,且因为做个示例,代码格式写的层层嵌套,但是大概实现关键代码都在,望各位大佬包容。

			downloadFile(){
				let link = 'https://www.gjtool.cn/pdfh5/git.pdf'
				//下载文件
				wx.downloadFile({
				  url: link,
				  success (res) {
				    if (res.statusCode === 200) {
					  //重新改写文件后缀
				      wx.getFileSystemManager().saveFile({
						  tempFilePath:res.tempFilePath,
						  //wx.env.USER_DATA_PATH 是微信提供了一个用户文件目录给开发者,开发者对这个目录有完全自由的读写权限
						  filePath:`${wx.env.USER_DATA_PATH}/hello.png`,
						    success(res) {
  						    console.log(res.savedFilePath) // res.savedFilePath 为一个本地缓存文件路径
							  //保存图片
							  wx.saveImageToPhotosAlbum({
								  filePath:res.savedFilePath,
							      success(res) {
									  console.log(res)
									  console.log('保存图片成功')
									  //这里可以出个弹窗,给用户提醒,让他去文件管理器里面找到后重命名
								  }
							  })
  						  }
					  })
				    }
				  }
				})
			},

该代码片段在自己的安卓机上测过了,可以实现。

2.方案二

? 先使用下载文件api把文件下载下来,再使用wx.openDocument()打开文件里面加上showMenu字段,然后就可以看到在打开的文件右上角出现了···

? ios表现:ios点击之后会有发送给朋友的选项,选择分享给朋友之后就可以把文件直接发送给对方了,然后你就可以在聊天记录里面拿到这个文件;

? 安卓表现:安卓手机里面有保存文件的选项;

缺陷:不能 “下载”后直接选择某个文件发给其他人,这个方案每次想发送必须先上小程序找到该文件,下载打开文件再去转发(而且必须是微信好友);或者在之前转发的聊天记录里面找到该文件。

代码:

			downloadFileOpen(){
				let link = 'https://www.gjtool.cn/pdfh5/git.pdf'
				//下载文件
				wx.downloadFile({
				  url: link,
				  success (res) {
				    if (res.statusCode === 200) {
						const filePath = res.tempFilePath
    					wx.openDocument({
    					  filePath: filePath,
						  showMenu:true, //关键点
    					  success: function (res) {
    					    console.log('打开文档成功')
    					  }
    					})
				    }
				  }
				})
			}

安卓具体表现:
安卓转发
ios具体表现:
在这里插入图片描述

总结

其实没啥好说的,仔细看官方文档还是能看到这个“文件下载保存功能”不是我们正常想的下载文件到手机里面,随便可以分享的。后续我们在项目中也是使用的方案二,方案一用户体验不好所以没有考虑了。

注意:因为微信小程序的能力也在不断增加,所以该文章适用于我文章发布时间。

个人水平有限,有问题欢迎大家留言指导,仅供学习和参考。

学海无涯!努力二字,共勉!

  移动开发 最新文章
Vue3装载axios和element-ui
android adb cmd
【xcode】Xcode常用快捷键与技巧
Android开发中的线程池使用
Java 和 Android 的 Base64
Android 测试文字编码格式
微信小程序支付
安卓权限记录
知乎之自动养号
【Android Jetpack】DataStore
上一篇文章      下一篇文章      查看所有文章
加:2022-03-13 21:56:51  更:2022-03-13 21:57:24 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年10日历 -2024/10/25 8:28:11-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码