/**
* 播放音频
* @param {string} type warn | right
*/
const playVoice = (type) => {
console.log('playVoice', type);
return new Promise((resolve) => {
const audioContext = uni.createInnerAudioContext();
audioContext.onEnded(() => {
console.log('onEnded');
audioContext.destroy();
// audioContext = null;
resolve();
});
audioContext.onPlay(() => {
console.log('onPlay');
});
audioContext.onError((err) => {
console.log('onError', err);
});
audioContext.src = `/static/voice/${type}.mp3`;
audioContext.play();
console.log('audioContext', audioContext);
});
};
// 调用的代码↓
// 播放声音
playVoice('right');
// data是接口返回的列表数据，需要渲染
this.offset = 0;
this.list = data;
k***@casstime.com
- 发布：2024-05-27 16:21
- 更新：2024-06-11 10:36
- 阅读：491
产品分类： uniapp/App
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： 12.6.5
HBuilderX类型： 正式
HBuilderX版本号： 4.08
手机系统： Android
手机系统版本号： Android 9.0
手机厂商： KAICOM PDA
手机机型： K7-40
页面类型： vue
vue版本： vue2
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
接口返回成功后把data赋值显示，并且播放成功声音
接口返回成功后把data赋值显示，并且播放成功声音
预期结果：
每次都有声音
每次都有声音
实际结果：
经常10次有3次没有声音
经常10次有3次没有声音
bug描述：
使用 uni.createInnerAudioContext(); 播放音频，偶尔出现不播放情况
调用playVoice()后，预期的打印：
playVoice, right at func/voice.js:6
audioContext, [Object] {"id":"17167973772550.6597362822302588","_callbacks":{"canplay":[],"play":["function() { [n...}
onPlay at func/voice.js:17
onEnded at func/voice.js:11实际偶尔出现不播放声音的情况：
16:18:50.481 playVoice, right at func/voice.js:6
16:18:50.580 audioContext, [Object] {"id":"17167979304380.8191429725832422","_callbacks":{"canplay":[],"play":["function() { [n...} at func/voice.js:25// ↑没有onPlay和onEnded
k***@casstime.com (作者)
let audioContext;
/**
* 播放音频
* @param {string} type warn | right
*/
const playVoice = (type) => {
return new Promise((resolve) => {
audioContext?.destroy();
audioContext = uni.createInnerAudioContext();
audioContext.onEnded(() => {
// 播放结束
resolve();
});
audioContext.onError((e) => {
console.log('play voice error', e);
});
audioContext.autoplay = true;
audioContext.src = `/static/voice/${type}.mp3`;
});
};
export default playVoice;
k***@casstime.com (作者)
声音问题基本解决了，你这个是没有销毁实例
我的是在每次创建前销毁
let audioContext;
/**
@param {string} type warn | right
*/
const playVoice = (type) => {
return new Promise((resolve) => {
audioContext?.destroy();
audioContext = uni.createInnerAudioContext();
audioContext.onEnded(() => {
// 播放结束
resolve();
});
audioContext.onError((e) => {
console.log('play voice error', e);
});
});
};
export default playVoice;
2024-06-11 09:31