Пример видео hls.js не работает в приложении реакции - PullRequest
Новая
       79

Пример видео hls.js не работает в приложении реакции

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

player.jsx file 

import React, { Component } from "react";
import Hls from "hls.js";

class Player extends Component {
  state = {};

  componentDidUpdate() {
    if (Hls.isSupported() && this.player) {
      const video = this.player;
      const hls = new Hls();
      hls.loadSource(
        "https://video-dev.github.io/streams/x36xhzz/x36xhzz.m3u8"
      );
      hls.attachMedia(video);
      hls.on(Hls.Events.MANIFEST_PARSED, function() {
        video.play();
      });
    }
  }

  render() {
    return (
      <div className="playerwrapper player">
        <div className="playerInner">
          <video
            className="videoCanvas"
            ref={player => (this.player = player)}
            autoPlay={true}
          />
        </div>
      </div>
    );
  }
}

export default Player;

, когда я его компилирую, он не мигает пример видео, вместо этого он выдает ошибку в консоли как 

blob:http://localhost:3000/5ea277e7-0ac6-466a-9fe8-ba838935e82f:42 Uncaught TypeError: Cannot read property 'call' of undefined
    at __webpack_require__ (blob:http://localhost:3000/5ea277e7-0ac6-466a-9fe8-ba838935e82f:42)
    at Object.srcDemuxDemuxerWorkerJs (blob:http://localhost:3000/5ea277e7-0ac6-466a-9fe8-ba838935e82f:184)
    at __webpack_require__ (blob:http://localhost:3000/5ea277e7-0ac6-466a-9fe8-ba838935e82f:42)
    at webpackBootstrapFunc (blob:http://localhost:3000/5ea277e7-0ac6-466a-9fe8-ba838935e82f:170)
    at blob:http://localhost:3000/5ea277e7-0ac6-466a-9fe8-ba838935e82f:173

Я установил, hls.js через npm i hls.js, он выдает ошибку при загрузке, хотя на вкладке сети он получает порции данных из ресурса загрузки, но не смог воспроизвести видео и из-за ошибки в консоли

...