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" ],
    },

相关推荐

  1. uniapp base64临时地址播放mp3

    2024-02-06 09:12:02       32 阅读
  2. uniapp将图片地址base64格式相互转换

    2024-02-06 09:12:02       14 阅读
  3. uniapp中封装一个svgbase64的组件

    2024-02-06 09:12:02       30 阅读
  4. base64PDF

    2024-02-06 09:12:02       38 阅读
  5. 【Android】Base64图片

    2024-02-06 09:12:02       19 阅读
  6. base64MultipartFile方法

    2024-02-06 09:12:02       13 阅读
  7. uniapp中预览base64图片

    2024-02-06 09:12:02       18 阅读
  8. 前端图片base64 方法

    2024-02-06 09:12:02       36 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-02-06 09:12:02       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-02-06 09:12:02       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-02-06 09:12:02       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-02-06 09:12:02       20 阅读

热门阅读

  1. Excel设置单元格下拉框(poi)

    2024-02-06 09:12:02       30 阅读
  2. docker 简单项目

    2024-02-06 09:12:02       32 阅读
  3. IEC61499 学习记录

    2024-02-06 09:12:02       33 阅读
  4. 大局观-高级后端工程师

    2024-02-06 09:12:02       21 阅读
  5. vmstat 监控虚拟内存,进程,CPU

    2024-02-06 09:12:02       27 阅读
  6. 面试复盘6——后端开发

    2024-02-06 09:12:02       35 阅读
  7. node.js 使用 elementtree 生成思维导图 Freemind 文件

    2024-02-06 09:12:02       38 阅读
  8. Spring Boot与Kafka集成教程

    2024-02-06 09:12:02       30 阅读
  9. ppi rust开发 python调用

    2024-02-06 09:12:02       29 阅读
  10. 第9章 SpringBoot综合项目实战——个人博客系统

    2024-02-06 09:12:02       32 阅读
  11. django解决Table ‘xx‘ already exists的方法

    2024-02-06 09:12:02       28 阅读