Экспресс передача аудиопотока к ответу не будет предварительно загружена в аудиотег браузера - PullRequest
0 голосов
/ 06 июля 2019

Я настроил конечную точку в Express, которая передает звук из хранилища BLOB-объектов Azure в мое приложение на стороне клиента.Технически это работает, но аудиоплеер не может предварительно загрузить любую дорожку.Это будет играть, но я не могу вычистить трек вперед, пока я фактически не выслушал все это.Я хочу, чтобы аудио продолжало передаваться на клиент независимо от того, воспроизводится ли оно.

Я знаю, что проблема должна быть связана с тем, как я передаю данные из Express, потому что у меня нет той же проблемы.если я попытаюсь извлечь mp3 из другого места в Интернете.

Аудио тег на стороне клиента

<audio controls preload="auto" autoPlay>
  <source
    src="http://localhost:4000/tracks/download?id=b87f52c0-95fc-11e9-b29c-a9d34d14769b"
    type="audio/mpeg"
  />
</audio>

Конечная точка экспресса

res.setHeader("content-type", "audio/mpeg");
        blob
          .createReadStream("tracks", req.query.id)
          .pipe(res);

Я просто передаю1-минутный клип, и он загружается мгновенно, когда я нажимаю «скачать».Он просто не загружает поток, поэтому я могу искать разные части трека.

Каждый пример, который я могу найти в Интернете, просто направляет поток к ответу, как я делаю.Я пытался связать .end () после pipe, но это ничего не изменило.

Я действительно открыт для любых идей о вещах, которые можно попробовать в данный момент.Я застрял на этом в течение нескольких часов.

Хорошо, я попытался изменить экспресс-код, чтобы он выглядел следующим образом, и он все еще не работает, но он сразу же регистрирует "вызов по вызову".Таким образом, на стороне клиента уже должны быть все данные, но звуковая метка, кажется, не осознает этого?Может быть, это не вина Экспресса в конце концов.Тем не менее, понятия не имею, что делать.

let test = blob.createReadStream("tracks", req.query.id);
   test.on("data", data => {
      console.log("data happening");
      res.write(data);
   });
   test.on("end", () => {
      console.log("end called");
      res.end();
   });

Gif не в состоянии искать вперед

...