YHJ木易
YHJ木易
  • 发布:2019-12-26 18:23
  • 更新:2021-04-16 10:30
  • 阅读:6341

APP读取本地文件夹内视频播放

分类:uni-app

需要用到的几个方法:

// 从本地缓存中同步获取指定 key 对应的内容。  
uni.getStorageSync(KEY)  
  
// 下载文件资源到本地,客户端直接发起一个 HTTP GET 请求,返回文件的本地临时路径。  
uni.downloadFile(OBJECT)  
  
// 保存视频到本地  
uni.saveFile(OBJECT)  
  
// 将 data 存储在本地缓存中指定的 key 中,会覆盖掉原来该 key 对应的内容,这是一个同步接口。  
uni.setStorageSync(KEY,DATA)

首先定义一个变量:获取本地缓存数据,看本地视频是存在。
获取已下载视频目录中的视频列表,删除无关视频。

const videoData = uni.getStorageSync('videoData')  
// 获取本地视频列表  
uni.getSavedFileList({  
	success: function (res) {  
		let fileList = res.fileList  
		console.log(fileList);  
		let needArr = videoData.map(item => item.videoAddress)  
		fileList.forEach((item, index) => {  
			if(needArr.includes(item.filePath)){  
				item.text = "需要这个视频"   
			}else{  
				// 删除视频列表中无关视频  
				uni.removeSavedFile({  
					filePath: item.filePath,  
					complete: function (res) {  
						console.log(res);  
					}  
				});  
			}  
		});  
		console.log(fileList)  
									  
	}  
});  

写个条件判断:如果存在直接将视频地址插入页面进行播放,如果不存在则进行下载视频-保存视频-缓存本地链接。

const _this = this;  
// 判断是否有缓存  
if(videoData){  
	console.log('我是视频-有缓存')  
	_this.videoSrc = videoData  
}else{  
	console.log('我是视频-没有有缓存')  
	_this.videoSrc = url // 我是在线链接  
	// 下载视频  
	_this.downFile(videoUrlYi,'videoData');  
}  
  
// 下载视频  
downFile(url,name){  
	const _this = this;  
	uni.downloadFile({  
		url: url,   
		success: (res) => {  
			if (res.statusCode === 200) {  
				console.log('下载成功');  
				console.log(res.tempFilePath)  
				//保存视频到本地  
				uni.saveFile({  
					tempFilePath: res.tempFilePath,  
					success: function (res) {  
						console.log('保存成功');  
						var savedFilePath = res.savedFilePath;  
						console.log(savedFilePath)  
						_this.videoSrc = savedFilePath  
						console.log('当前连接'+_this.videoSrc)  
						uni.setStorageSync(name, savedFilePath);  
					}  
				});  
			}  
		}  
	});  
}  

小编推荐:程序员网址导航

作为一名码农,随着平时工作的需要,这里收集了国内外很多优秀网站,这其中包括在线工具、在线运行、免费接口、在线资源、在线学习、技术论坛、技术博客等等,满足一般程序员日常需求。

地址:https://code-elf.cn/

0 关注 分享

要回复文章请先登录注册

samshum22

samshum22

為何不一下載回來就馬上播放?
又uni.saveFile 又要保存名字 uni.setStorageSync
2021-04-16 10:30
samshum22

samshum22

回复 samshum22 :
我用的是<video>{{_doc/uniapp_save/16184583954110.mp4}}</video>
2021-04-15 15:00
samshum22

samshum22

下面兩個框的代碼放反了
然後想請教一下,最後我saved的視頻是在"_doc/uniapp_save/16184583954110.mp4",的應該如何叫他播放
2021-04-15 14:13
unicorn_up

unicorn_up

这个方案使用的是通用api,不能满足自定义文件存储等功能。想高度自定义,还是要用plus.io
2021-04-08 17:52
machi的奶茶

machi的奶茶

回复 machi的奶茶 :
需要注意的是视频下载至播放期间的过渡
2021-01-11 14:39
machi的奶茶

machi的奶茶

赞一个!在video组件读取在线网络地址播放失败后,下载并保存到本地,重新赋值 :src=videoPath 即可播放。
2021-01-11 14:34
1***@qq.com

1***@qq.com

回复 最菜的韭菜 :
请问解决了吗
2020-11-04 09:52
最菜的韭菜

最菜的韭菜

回复 9***@qq.com :
木有哦
2020-10-19 14:05
9***@qq.com

9***@qq.com

回复 最菜的韭菜 :
我也是 请问解决了吗
2020-10-19 12:48
最菜的韭菜

最菜的韭菜

uni.saveFile保存之后的成功回调不管是图片或者视频都预览不了呢
2020-09-26 10:02