Создайте аудио-спрайт без загрузки всей песни - PullRequest
0 голосов
/ 10 февраля 2019

Я использую Howler JS для воспроизведения песен на веб-сайте.Я хочу, чтобы была проиграна только часть песни.

Я создаю спрайт для каждого mp3, и эти спрайты могут быть воспроизведены.Тем не менее, для воспроизведения звука требуется очень много времени.Как будто сначала загружается весь mp3, а затем начинается спрайт, который действительно снижает производительность и потребляет пропускную способность.Я вообще не знаком с Howler, может быть, есть способ загрузить только часть, которую нужно сыграть, или, если нет, есть ли другие библиотеки / способы сделать это?

         <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");
            });
          }}
        >

1 Ответ

0 голосов
/ 10 февраля 2019

Вы можете создавать записи каждого конкретного отрезка времени носителя, используя URI фрагментов мультимедиа, например, устанавливая src элемента <audio> в /path/to/media#t=10,15 для воспроизведения 10 через 15 секунд медиаресурса и MediaRecorder для записи воспроизведения и сохранения записи в виде .webm медиа файла, где MediaRecorder останавливается при pause событии HTMLMediaElement.

См.

Пример объединения нескольких фрагментов мультимедиа в одну запись см. MediaFragmentRecorder (автор кода в хранилище).MediaSource в Chromium / Chrome имеет проблемы, когда MediaRecorder используется для записи потока MediaSource, хотя код все равно должен давать ожидаемый результат в Firefox.

...