FastPix video data SDK with Shaka Player
FastPix video data SDK with Shaka Player
FastPix video data SDK with Shaka Player to enable video playback and analytics tracking. The code sets up a Shaka Player instance, configures metadata for analytics, and loads a video manifest for playback while handling potential errors.
1. Import required libraries
Import the FastPix Video Data SDK and Shaka Player libraries. The loadShakaPlayer function from @fastpix/video-data-shakaplayer provides integration utilities, and shaka-player provides the core Shaka Player functionality.
2. Initialize the Shaka Player
3. Define player metadata
4. Configure FastPix integration
5. Load the video manifest
6. Handle load success and errors
1import loadShakaPlayer from "@fastpix/video-data-shakaplayer";
2import shaka from "shaka-player";
3
4// Initialize player setup
5const initTime = loadShakaPlayer.utilityMethods.now();
6const videoElement = document.getElementById("video-player");
7const player = new shaka.Player(videoElement);
8
9// Define player metadata
10const playerMetadata = {
11 workspace_id: "WORKSPACE_KEY",
12 player_name: "PLAYER_NAME",
13 player_init_time: initTime,
14 video_title: "VIDEO_TITLE",
15 video_id: "VIDEO_ID",
16 viewer_id: "VIEWER_ID",
17 // Additional metadata can be added here
18};
19
20// Configure FastPix data integration
21const fastPixShakaIntegration = loadShakaPlayer(
22 player,
23 {
24 debug: false,
25 data: playerMetadata,
26 },
27 shaka,
28);
29
30// Load the video content
31const videoUrl =
32 "https://stream.fastpix.com/027a90e4-f5e2-433d-81e5-b99ee864c3f6.m3u8";
33
34player
35 .load(videoUrl)
36 .then(() => {
37 // Successfully loaded the manifest. FastPix data will begin tracking.
38 })
39 .catch((error) => {
40 fastPixShakaIntegration.handleLoadError(error);
41 });