Как повторно создать URL через createObjectURL

107

16 апреля 2022, 17:20

Есть данный код:

function getVideoFromServer() {
    socket.on('video', video => {
        let blob = new Blob([video.video], {
            type: 'video/webm; codecs=\"vp8, opus\"'
        });
        let url = URL.createObjectURL(blob);
        videoTag.src = url;
    });
}

Первый раз URL создаётся и декодируется нормально, но второй раз выдаёт предупреждение: "Не удаётся декодировать медиаресурс"

Answer 1

Потому что при создании URL.createObjectURL выделяется сегмент памяти для созданного объекта, эту память для каждого такого объекта нужно высвобождать, делается это при помощи URL.revokeObjectURL.

Я бы сделал такую фабрику:

const createVideoFromServerGetter = () => {
  let url;
  return () => {
    if (url) {
      window.URL.revokeObjectURL(url);
    }
    socket.on('video', video => {
      let blob = new Blob([video.video], {
        type: 'video/webm; codecs=\"vp8, opus\"'
      });
      url = window.URL.createObjectURL(blob);
      videoTag.src = url;
    });
  };
};
const getVideoFromServer = createVideoFromServerGetter();