Video Skips First Few Seconds When Using DASH Streaming

[Ulsah]

Description

I'm developing a e learning platform that needs video streaming. I user vuejs and laravel for backend. I use DASH streaming to play videos. I use video js with dash.js a videojs-contrib-dash packages. When I try to stream the player skips first few seconds of the video and plays flawlessly. I tested the same source .mpd file in VLC media player and it played with no issues. Can someone please point me in the right direction?

Steps to reproduce

Explain in detail the exact steps necessary to reproduce the issue.

1. Use ffmpeg to segment videos into 480p and 720p chunks and generate the .mpd file
2. Pass the .mpd file as source to video.js src attribute and type as application/dash+xml
3. Try playing the video

Results

Video plays after buffering for few seconds from the passed time location

Expected

Video playing from beginning

Actual

Video plays after buffering for few seconds from the passed time location

Additional Information

Here's the code I use in vue js:

// Video Options
videoOptions: {
autoplay: false,
controls: true,
preload: true,
sources: []
}
//Pushing source to videoOptions:
// Sets video URL
var source = video.link.replace('/public/', '/storage/');
var url = 'http://localhost:8000'+source+'video.mpd';
// The src and type attributes is added into videoOptions to be played
var object = {
src: url,
type: 'application/dash+xml'
}
this.videoOptions.sources.push(object);
this.videoKey += 1;

versions

videojs

Version: 7.8.3

browsers

Mozilla Firefox

OSes

Debian 10

plugins

dash.js and videojs-contrib-dash