当前位置: 首页 > article >正文

uniapp 之 base64转临时地址播放mp3

需求是:进入页面的时候是先有背景音乐,发送问题请求回答的时候会返回文字和音频,前端要把音频读出来,并且把背景音乐停止,读完音频后再打开背景音乐

一开始用的直接base64直接拼接在地址后 真机放不了

const innerAudioContext = wx.createInnerAudioContext();
innerAudioContext.src ='data:audio/mp3;base64,'+ 请求获取的base64编码的mp3格式文件;
innerAudioContext.play();

下面这个方式亲测有效

//背景音乐
			playBackground(innerAudioContext, stop) {
				// const innerAudioContext = uni.createInnerAudioContext();
				innerAudioContext.autoplay = true;
				innerAudioContext.loop = true; //循环播放
				innerAudioContext.src = 'https://wealthgod.oss-cn-beijing.aliyuncs.com/caishen/backgroundmq3.mp3';
				innerAudioContext.onPlay(() => {
					console.log('开始播放');
				});
				innerAudioContext.onStop((res) => {
					innerAudioContext.stop()
					//播放停止,销毁该实例
					innerAudioContext.destroy()

				});
				innerAudioContext.onEnded((res) => {
					innerAudioContext.play();
				});
			},
//回答音频			
playerAnswer(url) {
				const backgroundAudioManager = wx.getBackgroundAudioManager()
				var number = Math.random()
				const audioPath = wx.env.USER_DATA_PATH + '/new' + number + '.mp3'
				const fs = wx.getFileSystemManager();
				fs.writeFile({
					filePath: audioPath,
					data: url,
					encoding: 'base64',
					success(res) {
						backgroundAudioManager.title = '财神'
						backgroundAudioManager.src = audioPath
						backgroundAudioManager.onEnded((res) => {
							backgroundAudioManager.src = 'https://wealthgod.oss-cn-beijing.aliyuncs.com/caishen/backgroundmq3.mp3';
						});
					},
				})
			},
			this.playBackground(uni.createInnerAudioContext())
			this.playerAnswer(surl)//surl是背景地址
			
//manifest.json中
 /* 小程序特有相关 */
    "mp-weixin" : {     
        "requiredBackgroundModes" : [ "audio" ],
    },

http://www.kler.cn/a/231706.html

相关文章:

  • SkyWalking介绍
  • 【Rust自学】15.3. Deref trait Pt.2:隐式解引用转化与可变性
  • 关于使用微服务的注意要点总结
  • 二叉树的深度
  • SPP蓝牙串口
  • 项目练习:若依后台管理系统-后端服务开发步骤(springboot单节点版本)
  • Linux学习笔记(centOS)—— 文件系统
  • 直播电商“混战”,京东、视频号、百度“各显神通”
  • react将选中文本自动滑动到容器可视区域内
  • 大白话介绍循环神经网络
  • git 克隆拉取代码出现私钥权限问题。
  • RK Camera hal 图像处理
  • C# 实现微信自定义分享
  • 【Spring Boot】第二篇 自动装配原来就这么简单
  • 2024.2.7日总结(小程序开发4)
  • 通过nginx学习linux进程名的修改
  • 每日一题!如约而至!(图片整理,寻找数组的中心下标)
  • 寒假作业2月5号
  • 配置dns服务的正反向解析
  • JUnit5单元测试框架提供的注解
  • Django学习记录01
  • 如何使用websocket
  • LLVM实战之opt工具的使用
  • 每日一练 | 华为认证真题练习Day182
  • 大厂聚合支付系统架构演进(下)
  • 【开源】基于JAVA+Vue+SpringBoot的新能源电池回收系统