前端如何接收后端返回content-Type为application/octet-stream格式的音频文件

//文字转语音接口   

 function getWavData() {
        var xhr = new XMLHttpRequest();
        var url = urlWav;
        xhr.open('POST', url, true); // 设置请求方式POST方式      
        xhr.responseType = "arraybuffer"; // 返回类型blob       
        xhr.setRequestHeader("Content-Type","application/json");//设置请求内容类型
        xhr.setRequestHeader("sid",headerWav.sid);//设置请求内容类型
        xhr.setRequestHeader("sessionParam",headerWav.sessionParam);//设置请求内容类型
        // 请求回调函数，在请求后台完成，后台返回数据后执行此方法onload
        xhr.send(JSON.stringify({ "text": "好的，请稍等，这就为您操作" }));
        xhr.onload = function() {     
        if (this.status != 200) {// 判断请求状态码，看请求是否成功执行    
            $.walk.alert("导出失败！", "info");    
            return;        
        }      
        var content = this.response; //获取后台响应内容
        var context = new AudioContext();
        context.decodeAudioData(content, function (buffer) {
            // decodeAudioData，是支持promise，三参数的知识兼容老的
            let sourceNode = context.createBufferSource();
            sourceNode.buffer = buffer;
            sourceNode.connect(context.destination);
            sourceNode.start();
        }, function () {
            console.log('error');
        });        
        }
    }

说明：上面代码是通过原生xhr对象进行post请求文字转语音接口，之所以用原生ajax请求，是因为后台返回的数据格式为application/octet-stream，前端暂时我还不知道怎么来处理这种格式的二进制数据流(用blob对象存起来过，没什么用，有大佬知道怎么解析，烦请告知我一下)。这边直接通过xhr.responseType = "arraybuffer"强制改变后端返回数据格式，然后通过new AudioContext生成音频对象，直接解码数据流（decodeAudioData方法）进行播放就可以了。也可以通过将xhr.responseType = "blob"格式，通过audio标签来播放声音。具体代码如下：

    开始对讲
    关闭对讲
    start
    

 let sessionParamWav = {
        "audio_coding": "wav",
        "native_voice_name": "xiaozhou"
    };
    let sidWav = getUUID();
    let headerWav = {
        "sid": sidWav,
        "sessionParam": toBase64(sessionParamWav)
    }
    debugger;
    //文字转语音接口
    function getWavData() {
        debugger;
        var xhr = new XMLHttpRequest();
        var url = urlWav;
        xhr.open('POST', url, true); // 设置请求方式POST方式       
        xhr.responseType = "blob"; // 返回类型blob        
        xhr.setRequestHeader("Content-Type","application/json");//设置请求内容类型
        xhr.setRequestHeader("sid",headerWav.sidWav);//设置请求内容类型
        xhr.setRequestHeader("sessionParam",headerWav.sessionParam);//设置请求内容类型        
        // 请求回调函数，在请求后台完成，后台返回数据后执行此方法onload
        xhr.send(JSON.stringify({ "text": "好的，请稍等，这就为您操作" }));
        xhr.onload = function() {     
        if (this.status != 200) {// 判断请求状态码，看请求是否成功执行    
            $.walk.alert("导出失败！", "info");    
            return;        
        }        
        var content = this.response; //获取后台响应内容
        //解析后台返回的文件内容，这里主要是处理Blob类型
        var wavBlob = new Blob([ content ], {type : 'audio/wav'});
        $("#test").attr("src",window.URL.createObjectURL(wavBlob));
        //下载
        // var fileName = "ceshi" + ".wav";//
        
        //     var a = document.createElement("a");
        
        //     a.href = URL.createObjectURL(wavBlob);
        
        //     a.download = fileName;
        
        //     a.click();
        
        //     a.href = "";
        }
    }

function toBase64(sessionParam) {
        let sringifySession = JSON.stringify(sessionParam);
        return window.btoa(sringifySession);
    }

    function getUUID() {
        //用于生成uuid
        function S4() {
            return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
        }
        function guid() {
            return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
        }

        return "datav" + guid();
    }

上述两种方法都是亲测可用，有问题欢迎留言