uniapp recording function

<template>
	<view class="">
		<view>
			<button @tap="startRecord">开始录音</button>
			<button @tap="endRecord">停止录音</button>
			<button @tap="playVoice">播放录音</button>
		</view>
		<button @tap="junp">选择文件</button>
		<!-- <luch-audio 
				v-if="voicePath"
				:src="voicePath" 
				:play.sync="audioPlayNew"
			></luch-audio> -->
	</view>
</template>
 
<script>
const recorderManager = uni.getRecorderManager();
const innerAudioContext = uni.createInnerAudioContext();
 
innerAudioContext.autoplay = true;
 
export default {
	data() {
		return {
			text: 'uni-app',
			voicePath: '',
			url: ''
		};
	},
	onLoad() {
		let self = this;
		recorderManager.onStop(function(res) {
			console.log('recorder stop' + JSON.stringify(res));
			self.voicePath = res.tempFilePath;
			self.downloadFile(res.tempFilePath);
		});
	},
	methods: {
		junp() {
			uni.navigateTo({
				url: '../xuanze/xuanze'
			});
		},
		startRecord() {
			console.log('开始录音');
 
			recorderManager.start();
		},
		endRecord() {
			console.log('录音结束');
			recorderManager.stop();
		},
		playVoice() {
			console.log('播放录音');
			if (this.voicePath) {
				innerAudioContext.src = this.voicePath;
				innerAudioContext.play();
			}
		},
		downloadFile(url) {
			console.log(url);
			const downloadTask = uni.downloadFile({
				url: url, //文件链接
				success: res => {
					if (res.statusCode === 200) {
						uni.saveFile({
							tempFilePath: res.tempFilePath,
							success: red => {
								console.log(1, red.savedFilePath);
								uni.showToast({
									icon: 'none',
									mask: true,
									title: '文件已保存:' + red.savedFilePath, //保存路径
									duration: 3000
								});
								setTimeout(() => {
									//打开文档查看
									uni.openDocument({
										filePath: red.savedFilePath,
										success: function(res) {
											console.log('打开文档成功');
										}
									});
								}, 3000);
							}
						});
					}
				},
				fail: err => {
					uni.showToast({
						icon: 'none',
						mask: true,
						title: '失败请重新下载'
					});
				}
			});
		}
		// //***  先删除本地文件
		// deleteFile(url) {
		// 	uni.getSavedFileList({
		// 		success:(res)=> {
		//             if (res.fileList.length > 0) {
		// 				uni.removeSavedFile({
		// 				    filePath: res.fileList[0].filePath,
		// 					complete: function(res) {
		// 						this.downloadFile(url)
		// 					}
		// 				});
		// 			} else{
		// 				this.downloadFile(url)
		// 			}
		// 		}
		// 	});
		// },
		// //***  再下载文件
		// downloadFile(url){
		// 	uni.downloadFile({
		// 		url: url,   //下载地址接口返回
		// 		success: (data) => {
		// 			if (data.statusCode === 200) {
		// 				//文件保存到本地
		// 				uni.saveFile({
		// 					tempFilePath: data.tempFilePath,   //临时路径
		// 					success: function(res) {
 
		// 						// this.url = res.savedFilePath;
		// 						uni.setStorageSync('url', res.savedFilePath);
		// 					}
		// 				});
		// 			}
		// 		},
		// 		fail: (err) => {
		// 			uni.showToast({
		// 				icon: 'none',
		// 				mask: true,
		// 				title: '失败请重新下载',
		// 			});
		// 		},
		// 	});
		// },
	}
};
</script>
 
<style>
.content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
 
.logo {
	height: 200rpx;
	width: 200rpx;
	margin-top: 200rpx;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 50rpx;
}
 
.text-area {
	display: flex;
	justify-content: center;
}
 
.title {
	font-size: 36rpx;
	color: #8f8f94;
}
</style>
 

Guess you like

Origin blog.csdn.net/qq_19820589/article/details/131039028