从服务器获取完整的音频文件

我已经设置了客户端和服务器。我目前正在从服务器获取文件，然后将其流式传输到客户端。我尝试对其进行设置，以便音频在完全加载之前不会开始播放，但我仍然收到部分音频。但是，如果我在浏览器上下载该文件，所有音频都在那里。我正在实现 TTS 应用程序，因此无法直接预加载音频。如何强制浏览器在能够播放完整音频之前不播放？这是我到目前为止所拥有的。

const handleAudioLoaded = () => {
  console.log("Got here for the x'th time");
  const audioElement = document.getElementById(
    "audioplayer"
  ) as HTMLAudioElement;
  if (audioElement) audioElement.play();

{!loading && audio && (
            <ReactAudioPlayer
              id="audioplayer"
              src={`http://localhost:8000/audio/${audio}`}
              onCanPlayThrough={handleAudioLoaded}
              // onLoadedMetadata={handleAudioLoaded}
              preload="auto"
              controls
            />
          )}

在您的情况下，您可以使用

fetch

fetch(`https://your-audio-location)
  .then(res => res.blob())
  .then((myBlob) => {
    const objectURL = URL.createObjectURL(myBlob);
    const newAudioURL = objectURL;
  });