HTML5 видео "закончилась" событие иногда не срабатывает, когда видео заканчивается

Question

В приложении, которое я и моя команда разрабатываем, мы используем HTML5-видео компонент для отображения .mp4 видео в полноэкранном режиме. Это веб-API ASP.NET на внутреннем интерфейсе с SignalR, а также приложение Electron с Angular 4 на внешнем интерфейсе. Работает следующим образом:

• Как только приложение Electron запущено, оно пингует API
• Backend предоставляет URL-адрес приложения для воспроизведения через SignalR
• Приложение затем загружает видео и уведомляет серверную часть о том, что видео загружено и запущено
• После запуска (ended) мы уведомляем серверную часть о том, что видео закончилось
• Приложение затем отображает некоторый другой контент в течение настраиваемого промежутка времени (обслуживается бэкэндом)
• По истечении времени ожидания на бэкэнде мы уведомляем приложение Electron для отображения следующего видео для воспроизведения
• Нажатие на отображаемое в данный момент видео прервет его и будет отображаться другой контент. По истечении времени ожидания бэкэнд обслуживает прерванное видео
• Повторите

Одна из проблем, которые мы обнаружили в последнее время, заключается в том, что иногда (ended) не запускается, когда видео заканчивается, и наше приложение застревает, потому что оно никогда не вызывало обратный вызов, чтобы закончить, что видео закончилось .

Вот код:

Компонент для отображения видео

<div (click)="clickOnScreen()" class="full-size" [@fadeInOut]>
    <video muted autoplay preload="auto" (ended)="onVideoEnded()" #videoplayer>
        <source [src]="sanitizeUrl(videoPath)" type="video/mp4" />
    </video>
</div>

onVideoEnded() {
        this.logger.info("Video ended.");
        const videoEnded = new VideoEnded();

        const subscription = this.videoPlayerService.videoEnded(videoEnded).subscribe(
            (success) => {
                this.logger.info("Successfully notified Backend that the video has ended.");
                subscription.unsubscribe();
            },
            (error) => {
                this.logger.error(error);
                subscription.unsubscribe();
            });
    }

Загрузка видео после получения от сервера:

private loadVideo(videos: Videos[]) {
        this.videos = videos;

        if (this.videos === null || this.videos.length === 0) {
            this.logger.warn("no videos sent!");
            return;
        }

        this.logger.info("Starting playback...");
        this.startPlayback();

        this.logger.info("Playback started! Notifying Backend that the video has been displayed...");    
        const subscription = this.videoPlayerService.videoDisplayedOnScreen().subscribe(
            (success) => {
                this.logger.info("Successfully notified Backend that the video has been displayed!");
                subscription.unsubscribe();
            },
            (error) => {
                this.logger.error(error);
                subscription.unsubscribe();
            });
    }

private startPlayback() {
        this.videoNumber = this.videos[0].orderNumber;
        this.videoPath = this.videos[0].videoPath;

        this.videoplayer.nativeElement.currentTime = this.videos[0].currentTime;
        this.videoplayer.nativeElement.load();
        this.cd.markForCheck(); 
    }

clickOnVideo() {        
    const subscription = this.touchService.clickOnVideo().subscribe(
        (success) => {
            subscription.unsubscribe();
        },
        (error) => {
            this.logger.error(error);
            subscription.unsubscribe();
        });
}

Я посмотрел, может ли что-то быть связано с самим видео, однако все настроенные видео могут воспроизводиться в течение 4-5 часов, а затем просто внезапно останавливаются и (ended) не запускается. Есть ли какой-то другой способ устранить это? Любая помощь будет оценена!