https://github.com/apivideo/api.video-hlsjs-analytics

api.video player analytics plugin for hls.js based players
https://github.com/apivideo/api.video-hlsjs-analytics

hls hlsjs video video-analytics video-player

Last synced: 6 months ago
JSON representation

api.video player analytics plugin for hls.js based players

• Host: GitHub
• URL: https://github.com/apivideo/api.video-hlsjs-analytics
• Owner: apivideo
• License: mit
• Created: 2021-03-24T14:31:47.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2024-07-30T14:11:46.000Z (about 1 year ago)
• Last Synced: 2025-03-23T19:44:44.836Z (7 months ago)
• Topics: hls, hlsjs, video, video-analytics, video-player
• Language: TypeScript
• Homepage: https://api.video
• Size: 365 KB
• Stars: 19
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE

Awesome Lists containing this project

README

          

[![badge](https://img.shields.io/twitter/follow/api_video?style=social)](https://twitter.com/intent/follow?screen_name=api_video)   [![badge](https://img.shields.io/github/stars/apivideo/api.video-hlsjs-analytics?style=social)](https://github.com/apivideo/api.video-hlsjs-analytics)   [![badge](https://img.shields.io/discourse/topics?server=https%3A%2F%2Fcommunity.api.video)](https://community.api.video)

![](https://github.com/apivideo/.github/blob/main/assets/apivideo_banner.png)

![npm](https://img.shields.io/npm/v/@api.video/hlsjs-player-analytics) ![ts](https://badgen.net/badge/-/TypeScript/blue?icon=typescript&label)

api.video hls.js analytics module


[api.video](https://api.video) is the video infrastructure for product builders. Lightning fast video APIs for integrating, scaling, and managing on-demand & low latency live streaming features in your app.

## Table of contents

- [Table of contents](#table-of-contents)

- [Project description](#project-description)

- [Getting started](#getting-started)

  - [Setup](#setup)

  - [Code sample](#code-sample)

- [Documentation](#documentation)

  - [Module instantiation](#module-instantiation)

  - [Instantiation example](#instantiation-example)

## Project description

hls.js module to call the api.video analytics collector. 

## Getting started

### Setup

Include `https://unpkg.com/@api.video/hlsjs-player-analytics` in your web page.

```html

```

### Code sample

Include the module in your HTML file like so:

```html

    

        

        

    

    

    

        

    

        var video = document.getElementById('video');

        

        var videoSrc = 'https://cdn.api.video/vod/vi5oDagRVJBSKHxSiPux5rYD/hls/manifest.m3u8';

        if (Hls.isSupported()) {

            var hls = new Hls();

            new HlsJsApiVideoAnalytics(hls);

            hls.loadSource(videoSrc);

            hls.attachMedia(video);

        }

    

    

```

## Documentation

### Module instantiation

Then, before having instantiated `Hls`, instantiate a `HlsJsApiVideoAnalytics` object. 

The `HlsJsApiVideoAnalytics` constructor take the following parameters:

| Parameter name | Mandatory | Type                                        | Description         |

| -------------: | --------- | ------------------------------------------- | ------------------- |

|            hls | **yes**   | `Hls` instance                              | the instance of Hls |

|        options | no        | `HlsJsApiVideoAnalyticsOptions` (see below) | optional options    |

Available options (`HlsJsApiVideoAnalyticsOptions`):

|  Option name | Mandatory | Type                                  | Description                                                                                                  |

| -----------: | --------- | ------------------------------------- | ------------------------------------------------------------------------------------------------------------ |

| userMetadata | no        | ```{ [name: string]: string }[]```    | object containing [metadata](https://api.video/blog/tutorials/dynamic-metadata/) (see **Full example** below) |

|     sequence | no        | ```{start: number; end?: number;} ``` | if only a sequence of the video is going to be played                                                        |

### Instantiation example

```javascript

var hls = new Hls();

new HlsJsApiVideoAnalytics(hls, {

    sequence: {

        start: 10,

        end: 50

    },

    userMetadata: {

        gender: "male"

    }

});

```