Trying to get the analytics working with video.js player and single page app. Video is loaded into a modal using player.src({
type: ‘application/x-mpegurl’,
src: “https://xxxxm3u8”
});
This did not fix the issue. This release Bitmovin Docs - Analytics Web Release 2.5.2 suggest it was fixed, however, I can not find an example of how this fix should be implemented. Any suggestions?
We are using bootstrap 4 modal for the video tag and the error still exist using the above code. We removed all videojs options and other not necessary scripts and still get the Bitmovin Analytics is already hooked up to this player instance error. We tried using the following on modal close but that did not fix it.
$(‘.modal’).on(‘hidden.bs.modal’, function (e) {
var video = videojs(‘my-video’);
video.pause();
video.removeAttribute(‘src’);
});
I can email you a link to our test page.
$(document).on(‘click’,‘.play’,function(){
var id = $(this).data(‘id’);
var title = $(this).data(‘title’);
var analyticsConfig = {
key: “xxxxxxxxxxxxx”
};
const player = videojs(‘my-video’);
const collector = new bitmovin.analytics.adapters.VideojsAdapter(analyticsConfig, player);
collector.sourceChange({videoID: id, videoTitle: title});
player.src({
src:“https://xxxxxx/“+id+”/playlist.m3u8”,
type: ‘application/x-mpegURL’,
});
$(“#videoModal”).modal(‘show’);
});
I can see that we use that field for internal tracking wether the player has been connected with the collector. Using it like that could lead to duplicated tracking. I would not recommend using it.
From what i can see in this example is the following:
I can see multiple init calls for the player var video = videojs(‘my-video’);. I’m not so familiar with the videoJs player but in this case i assume that we get the same reference of player instance every time we call videojs(<identifier>)
If this is the case calling new bitmovin.analytics.adapters.VideojsAdapter(analyticsConfig, player); might end up calling it with the same instance multiple time.
I would recommend to create the player and collector once. And make sure you use the same instance for starting/pausing/switching the video.
right after collector initialisation you call collector.sourceChange({videoID: id, videoTitle: title}); this is not needed for first video to play. You provide the videoTitle and videoId within the analyticsConfig.
AFAICS the problem is that you create a new collector instance every time you show the modal. Saving the collector globally can fix the issue.
Separating the setup of player and collector from the show and switch might also help.
I hope this is of help to you
2022-10-11 UPDATE 1:
AFAICS the problem is that you create a new collector instance every time you show the modal. Saving the collector globally can fix the issue.
Separating the setup of player and collector from the show and switch might also help.
In this case we need to create a new collector instance with every modal open.
As a workaround for the error Bitmovin Analytics is already hooked up to this player instance you can set videoJsPlayer.__bitmovinAnalyticsHasBeenSetup = false
We are not seeing any duplicated tracking using video.__bitmovinAnalyticsHasBeenSetup = false; to unhook the tracker.
Can all tracking vars including customData1 etc. be added to collector.sourceChange({videoID: id, videoTitle: title}); because the parameters are not the same as in analyticsConfig? If so, can you provide the correct parameters to pass?
We tried creating the player and collector once and passing the vars with collector.sourceChange but impressions were not tracked. The current tracker seems to need a new instance and new analyticsConfig.
The only way we can get the tracking to work with a modal at the moment is to create a new instance of the collector each time it opens and to unhook it on modal close. Perhaps in a new release the analyticsConfig can be broken into two parts, initial config like setting the license key and then a tracking call.