問(wèn)題

前端一般播放音頻都是通過(guò)鏈接播放，這個(gè)鏈接一般是后端接口返回，于安全考慮，后端不應(yīng)該向外部返回可用鏈接。
那么另外一種思路就是先通過(guò)接口下載好音頻文件，再播放

代碼

需要注意的是
1、異步請(qǐng)求
2、使用xhr的方式
3、返回類型為blob，通過(guò)【window.URL.createObjectURL】方法創(chuàng)建臨時(shí)可播放文件
4、使用audio標(biāo)簽播放

play: async function () {
            const xhr = new XMLHttpRequest();
            const url = 'XXX接口地址';
            // 設(shè)置請(qǐng)求方式POST方式
            xhr.open('POST', url, true);
            // 返回類型blob
            xhr.responseType = "arraybuffer";
            xhr.setRequestHeader("Content-Type", "application/json");
            xhr.send();
            xhr.onload = function () {
                const content = this.response; //獲取后臺(tái)響應(yīng)內(nèi)容
                alert(content);
                const wavBlob = new Blob([content], {type: 'audio/wav'});
                const audio = document.getElementById('audio');
                alert(audio);
                audio.src = window.URL.createObjectURL(wavBlob);
                alert(audio.src);
                audio.play();
            }
        }