制作音频精灵，而无需加载完整的歌曲

Question

我用吼JS到一个网站上播放的歌曲。我想播放的只是歌曲的部分。

林使每个MP3的精灵和精灵那些可以播放。然而，它需要很长的音频播放之前。这就像整个MP3是先下载，然后精灵开始，真正降低性能并消耗带宽。林不熟悉吼可言，也许有一种方法来下载只是部分进行播放，或者如果没有，是否有任何其他库/方法来做到这一点？

         <div
          className="playExtrait"

          onClick={() => {
            Howler.unload();
            let song = new Howl({
              src: [url],
              html5: true,
              sprite: {
                extrait: [0, 30000]
              }
            });

            let songID = song.play("extrait");
            setPlayPause("playing");
            song.fade(1, 0, 30000, songID);
            song.on("end", () => {
              setPlayPause("paused");
            });
          }}
        >

Answer 1

您可以通过使用Media Fragments URI，例如，通过设置src元素的<audio>通过媒体资源和/path/to/media#t=10,15的10秒，15为MediaRecorder的播放记录回放创建媒体的每个特定时间段的记录并保存记录作为一个.webm媒体文件，其中MediaRecorder停止在pause的HTMLMediaElement事件。

看到

• How to edit (trim) a video in the browser?
• How to get a precise timeupdate on a video to return upto 2 decimal numbers (milliseconds)?
• Javascript - Seek audio to certain position when at exact position in audio track
• How to use Blob URL, MediaSource or other methods to play concatenated Blobs of media fragments?？

用于级联多个媒体片段到一个单一的记录的一个例子见MediaFragmentRecorder（是代码中的信息库中的作者）。当MediaSource用来记录一个MediaRecorder流，虽然代码仍然应该产生在Firefox中预期的结果MediaSource在铬/铬有问题。