Ionic iOS - HTML-видео чернеют после воспроизведения нескольких - PullRequest
Новая
       40

Ionic iOS - HTML-видео чернеют после воспроизведения нескольких

0 голосов
/ 29 декабря 2018

Я создаю приложение, в котором пользователь воспроизводит несколько html5-видео в разных компонентах по мере продвижения потока страниц.Исходники mp4 для видео поступают из локальной файловой системы.

Все отлично работает в веб-версии, которую я развернул на сервере, и люди используют с Chrome.

Однако в iOS послевоспроизводя приблизительно 18 из этих видео, ВСЕ видео перестают работать, и появляется только черный ящик.(Я смог воспроизвести его на iPad 3 и 4) Есть идеи, что может быть причиной этого?У меня такое ощущение, что это должно быть как-то связано с каким-то кешем / памятью, потому что проблема появляется только после воспроизведения приблизительного количества видео.Кроме того, видео снова воспроизводится после закрытия и повторного открытия приложения.

Пример разметки видео 

    <video id="video_1" playsinline playsinline="playsinline" webkit-playsinline webkit-playsinline="webkit-playsinline">
       <source [attr.src]="ds.normalizeURL(video[0])" type="video/mp4"/>
    </video>

Я постараюсь выяснить, связано ли это с файламикешируется в File.cacheDirectory, но мне не очень повезло с таким подходом.

АЛЬТЕРНАТИВНО, есть ли способ в Ionic воспроизводить видео с собственными возможностями, но не может воспроизводить их встроенными в макет страницы, а неполноэкранный?Я ничего не нашел

Мои версии: Ionic: 3.9.2 Angular: 5.2.9

1 Ответ

0 голосов
/ 02 января 2019

Это действительно была проблема, связанная с памятью / сборкой мусора.Я реализовал это , и проблема исчезла. 

import {Component, Input, ViewChild} from 'angular2/core';

@Component({
   selector: "releasable-video",
   template: '<video [src]="src" #player></video>'
})
export class ReleasableVideoComponent {

@Input() src : string
@ViewChild('player') player;

constructor() {

}
ngOnDestroy() {
    // the .nativeElement property of the ViewChild is the reference to the <video> 
    this.player.nativeElement.src = '';
    this.player.nativeElement.load();
}
...