Javascript 从blob设置音频元素源

我的页面上有一个音频控件，看起来像：

<audio id="myAudio" controls>
    <source id="myAudioSource" src="https://my-site/mp3/123456" type="audio/mp3">
</audio>

fetch("https://my-site/mp3/123456", { method: "GET", headers: { "my-header": "my-header-value" }})
    .then(response => response.blob())
    .then(blob => {
        const audioUrl = window.URL.createObjectURL(blob);
        myAudioSource.src = audioUrl;
        myAudio[0].load();
     })
     .catch(console.error);

---

我在其他地方看到过这样做的例子，所以我相信它应该会起作用。我没有得到任何错误，我可以逐步通过代码，这样我就可以看到每一行被击中。blob看起来是正确的，因为它有正确的类型（音频/mp3）和正确的大小，但音频控件永远无法播放。我缺少什么？

只需设置工作室本身的src，可能是加载问题

---

为什么不使用myAudioSource.load（）？

给定的

https://my-site/mp3/123456

解析为实际的MP3文件。 另外（因为它是您的服务器），为什么不使用相对路径：

/mp3/

const EL_audio=document.querySelector（“#myAudio”）；
获取（“/mp3/123456”）
.then（response=>response.blob（））
.然后（blob=>{
EL_audio.src=URL.createObjectURL（blob）；
EL_audio.load（）；
})
.catch（控制台错误）；

不使用相对路径的原因是它实际上不在同一个站点上-它很复杂，我无法控制。我认为问题在于我在源代码上设置了url，但在主音频元素上加载了url。仍然有点困惑，因为当我试图解决如何做到这一点时，我发现这些例子正是我正在做的——我想它们也不起作用。