VMAP Parser, JwPlayer and VideoJs plugin

VMAP Parser, JwPlayer and VideoJs plugin.

Showing a VMAP ad require to parse the VMAP xml and show ad in video player. This package handle VMAP parsing (to a JS object), VideoJs plugin and JwPlayer plugin. You can use this package in Browser (umd) or Node (es).

Install

You can install this package with npm:

npm install vmap-kit@latest

or with yarn:

yarn add vmap-kit@latest

Parse VMAP

To parse VMAP xml in browser you need to load the script:

<script src="dist/parser/browser.js"></script> 

and then parse the xml. An example of load VMAP from remote can be found in bellow:

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (this.readyState === 4 && this.status === 200) {
        var vmapObject = VMAP.JSON(xhr.responseText);
        console.log(vmapObject);
    }
};
xhr.open("GET", "vmap.xml");
xhr.send();

Video Player plugin

The official JwPlayer's ad plugin isn't free and you can find a free version here. The VideoJs and JwPlayer plugins load the VMAP xml and show the ad.

Currently these plugins support these types of MediaFile's mimetype:

• image/gif
• image/png
• image/jpeg
• video/mp4

and also can play ads this start and end time offset.

This plugins append location.href as p, document.referrer as r and a fingerprint as tid to the request of vmap.

Warning: from 1.0.3 version, the plugin name change from vmap to vast.

JwPlayer VMAP Plugin

To show ad in JwPlayer you need put this config in your JwPlayer config:

var playerInstance = jwplayer("video");
playerInstance.setup({
    ....
    plugins: {
        "dist/jwplayer/vmap.js": {}
    },

    advertising: {
        client: "vast",
        schedule: "/sample/vmap.xml" // VMAP endpoint address
    }
    ....
});

An example of JwPlayer can be found here.

VideoJs VMAP Plugin

To show ad in VideoJs you need load the plugin script:

<script src="/dist/videojs/vmap.js"></script>

and then config the VideoJs to show ad in its options:

plugins: {
        vast: {
            requestUrl: '/sample/vmap.xml',
        }
    }

An example of JwPlayer can be found here.

Todo List

• Tests
• Support other time offsets

License

The license of this package is MIT License and is being developed in ClickYab.