Monitor NexPlayer | Mux

Monitor NexPlayer

Connect Mux Data to NexPlayer to collect playback performance metrics. Use this guide when your web application plays video with the NexPlayer HTML5 SDK. NexPlayer manages this integration.

In this guide:

Mux Data collects playback performance metrics from NexPlayer. Use this guide when your web application plays video with the NexPlayer HTML5 SDK and you want to monitor the playback experience of your viewers. NexPlayer manages this integration. You do not need Mux Video to use Mux Data.

Third-party integration

This integration is managed and operated by NexPlayer. Feedback should be made on the GitHub repo's Issues page or by contacting NexPlayer support by email.

1. Install NexPlayer_HTML5_Mux

Add the NexPlayer_HTML5_Mux plugin to your project by cloning the GitHub repo or installing using yarn/npm.

2. Initialize Mux Data

Get your ENV_KEY from the Mux environments dashboard.

ENV_KEY is a client-side key used for Mux Data monitoring. These are not to be confused with API tokens which are created in the admin settings dashboard and meant to access the Mux API from a trusted server.

Add NexPlayer as you normally would to your solution including recommended CSS styling. In addition, you will need to import the Mux SDK and NexMuxHandShake.js into the <head /> and set the window.muxPlayerInitTime to the current date/time.

NexPlayer minimum version

Be sure to use the NexPlayer SDK v5.5.3.1 as it contains necessary functionality to integrate with Mux.

3. Make your data actionable

The only required field in the options that you pass into the NexPlayer_HTML5_Mux plugin is ENV_KEY. But without some metadata the metrics in your dashboard will lack the necessary information to take meaningful actions. Metadata allows you to search and filter on important fields in order to diagnose issues and optimize the playback experience for your end users.

Pass in metadata under the muxConfiguration on initialization.

4. Changing the video

There are two cases where the underlying tracking of the video view need to be reset:

New source: When you load a new source URL into an existing player.
New program: When the program within a singular stream changes (such as a program change within a continuous live stream).

New source

If your application plays multiple videos back-to-back in the same video player, you need to signal when a new video starts to the Mux SDK. Examples of when this is needed are:

The player advances to the next video in a playlist
The user selects a different video to play

In order to signal the Mux SDK that a new view is starting, you will need to emit a videochange event, along with metadata about the new video.

New program

In some cases, you may have the program change within a stream, and you may want to track each program as a view on its own. In this case, you emit a programchange event, including the updated metadata for the new program within the continuous stream.

5. Advanced options

Disable cookies

By default, Mux plugins for HTML5-based players use a cookie to track playback across subsequent page views in order to understand viewing sessions. This cookie includes information about the tracking of the viewer. This is done by setting disableCookies: true in the options.