Skip to content

ReferenceExtensions

mux-data

Options for the Mux Data extension that monitors playback quality

Adds the Mux Data extension to the player. It renders nothing — place it anywhere inside the player, and it follows whatever media the player attaches. See Mux Data for how monitoring works.

Import

pnpm add @videojs/html @videojs/mux-data
import '@videojs/html/extensions/mux-data';

Or load it from the CDN:

<script type="module" src="https://cdn.jsdelivr.net/npm/@videojs/cdn@10.3.0/extensions/mux-data.js"></script>

Anatomy

<mux-data></mux-data>

Options

Attribute Property Description
env-key envKey Mux Data environment key the beacons are sent to. Optional for Mux-hosted playback
— metadata Mux Data metadata for the view
player-software-name playerSoftwareName Player name reported to Mux Data. Defaults to videojs-html-<engine>; see Player software name
player-software-version playerSoftwareVersion Player version reported to Mux Data. Defaults to the Video.js version
player-init-time playerInitTime Epoch milliseconds the player was initialized. Defaults to when the player was created
beacon-collection-domain beaconCollectionDomain Custom domain the beacons are sent to
disable-cookies disableCookies Stops the SDK from setting cookies
debug debug Turns on SDK debug logging
— MuxDataSdk SDK used for monitoring. Set it to undefined to switch monitoring off

metadata and MuxDataSdk take objects, so they’re properties only, with no matching attribute. Set them on the element, typed as the MuxDataExtension class that @videojs/html/extensions/mux-data exports.

Views also report the extension itself as the Mux plugin, so they can be told apart from other Video.js integrations such as videojs-mux.

Player software name

When no player software name is set, views report videojs-<framework>-<engine>, where the framework is html or react and the engine is the one playing the current source:

Engine Played by
hlsjs hls.js
spf-hls-video The SPF video engine
spf-hls-audio The audio-only SPF engine
spf-hls-background-video The SPF background video engine
shaka Shaka Player
dashjs dash.js
browser The browser itself, like native HLS in Safari or an MP4 file

The framework is always one word, so everything after the second hyphen is the engine. The name updates on the current view when a source change switches engines. Media that doesn’t declare an engine name leaves it out, as in videojs-html. A player software name you set always takes precedence.

The player software version defaults to the Video.js version, and the Mux plugin is reported as @videojs/mux-data at the same version.

Changing MuxDataSdk, beaconCollectionDomain, debug, or disableCookies restarts monitoring, which ends the current view and starts a new one. The rest update the view in place.

See also