xgplayer-mpegts.js

中文

A extension plugin which integrated mpegts.js based on xgplayer.

Some code references are taken from xgplayer-flv.js.

How to use

install

$ npm istall xgplayer
$ npm istall xgplayer-mpegts.js

Usage

html

<div id="vs"></div>

js

import Player from "xgplayer";
import "xgplayer/dist/xgplayer.min.css";
import MpegtsPlugin, { type MpegtsPluginConfig } from "xgplayer-mpegts.js";

const player = new Player({
  id: "vs",
  url: "//sf1-cdn-tos.huoshanstatic.com/obj/media-fe/xgplayer_doc_video/flv/xgplayer-demo-720p.flv",
  plugins: [MpegtsPlugin],
  MpegtsPlugin: {
    mediaDataSource: { type: "flv" },
    mpegtsConfig: {},
  } as MpegtsPluginConfig, // config for plugin MpegtsPlugin
  // If use CDN loading,you can Get the plugin through window.MpegtsPlugin
});

Get the mpegts instance

const mpegtsInstance = player.__mpegts__;
// or
const mpegtsInstance = player.plugins.mpegtsplugin.mpegts;

Live stream frame-chasing configuration

For specific configurations, refer to the mpegts official documentation

const player = new Player({
  id: "vs",
  url: "",
  isLive: true,
  plugins: [MpegtsPlugin],
  MpegtsPlugin: {
    mediaDataSource: { type: "flv" },
    mpegtsConfig: { liveBufferLatencyChasing: true, liveSync: true },
  } as MpegtsPluginConfig,