记录一下 将后台返回 音频流 进行播放 转载请注明出处
1 // 实时获取后台返回的 音频流（MP3流）并进行播放 2 export function baseAudioFetch(params) { 3 return new Promise((resolve, reject) => { 4 axios({ 5 method: 'post', 6 url: 'http://172.30.102.224:8080/api/v1/tts/bd/text2AudioRetMP3?content=' + params.content + '&userID=' + 7 params.userID, 8 responseType: 'arraybuffer' 9 }).then((response) => { 10 11 // 将 blob 数据转换成 url 12 let mp3Url = window.URL.createObjectURL(new Blob([response.data])) 13 console.log(mp3Url) 14 15 // 进行音频播放 16 audio = new Audio(); 17 audio.src = mp3Url; 18 audio.play(); 19 20 21 resolve('语音播放成功'); 22 }).catch((error) => { 23 showToast('资源请求出错'); 24 reject(error); 25 }) 26 }) 27 }
优化：全局声明播放
1 // 全局声明 audio 2 let audio = null; 3 4 // 实时获取后台返回的 音频流（MP3流）并进行播放 5 export function baseAudioFetch(params) { 6 return new Promise((resolve, reject) => { 7 axios({ 8 method: 'post', 9 url: 'http://172.30.102.224:8080/api/v1/tts/bd/text2AudioRetMP3?content=' + params.content + '&userID=' + 10 params.userID, 11 responseType: 'arraybuffer' 12 }).then((response) => { 13 14 // 将 blob 数据转换成 url 15 let mp3Url = window.URL.createObjectURL(new Blob([response.data])) 16 17 // 进行音频播放 18 try { 19 //是否已经声明过 20 if (audio == null) { 21 audio = new Audio(); 22 audio.addEventListener('ended', function() { 23 localStorage.setItem('audioEnded', true); 24 }, false); 25 } 26 if (mp3Url) { 27 audio.src = mp3Url; 28 audio.play(); 29 } 30 } catch (e) {} 31 32 33 resolve('语音播放成功'); 34 }).catch((error) => { 35 showToast('资源请求出错'); 36 reject(error); 37 }) 38 }) 39 }