ManagedMediaSource: sự kiện startstreaming

Khả dụng hạn chế

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Note: This feature is available in Dedicated Web Workers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

Sự kiện startstreaming của giao diện ManagedMediaSource được kích hoạt khi thuộc tính streaming thay đổi từ false sang true. Điều này cho thấy tác nhân người dùng cần thêm dữ liệu để đảm bảo phát lại không bị gián đoạn, và ứng dụng nên bắt đầu tải và nối thêm các phân đoạn media.

Cú pháp

Sử dụng tên sự kiện trong các phương thức như addEventListener(), hoặc đặt thuộc tính trình xử lý sự kiện.

addEventListener("startstreaming", (event) => {});

onstartstreaming = (event) => {};

const videoUrl =
  "https://mdn.github.io/shared-assets/videos/flower-fragmented.mp4";
const mediaType = 'video/mp4; codecs="avc1.64001F, mp4a.40.2"';

if (ManagedMediaSource.isTypeSupported(mediaType)) {
  const video = document.createElement("video");
  const source = new ManagedMediaSource();

  video.controls = true;
  video.disableRemotePlayback = true;
  video.src = URL.createObjectURL(source);
  document.body.appendChild(video);

  source.addEventListener("sourceopen", () => {
    const sourceBuffer = source.addSourceBuffer(mediaType);

    source.addEventListener("startstreaming", async () => {
      console.log("startstreaming — fetching media data");
      const response = await fetch(videoUrl);
      const data = await response.arrayBuffer();
      sourceBuffer.appendBuffer(data);
    });
  });
}