ReactJS chrome cast 集成到视频标签

问题描述

如何管理正在流式传输 aws IVS 频道的 HTML5 视频标签的 chromecast。我已设法将频道流式传输到视频标签中,但无论如何它都无法处理 chromecasting。

function App(props) {

  const divel = useRef(null);
  const videoEl = useRef(null);

  useEffect(() => {
    const script = document.createElement('script');

    script.src = 'https://player.live-video.net/1.0.0/amazon-ivs-player.min.js';
    script.async = true;

    document.body.appendChild(script);

    script.onload = () => {
      if (IVSPlayer.isPlayerSupported) {
        const player = IVSPlayer.create();
        player.attachHTMLVideoElement(document.getElementById('video-player'));
        player.load(STREAMING_URL);
        player.play();
        player.chromecasting() // it is throwing the error. 
      }
    }

    return () => {
      document.body.removeChild(script);
    }

  },[])

  return (
    <React.Fragment>
    <div ref={divel} className="video-streaming">
      <video id="video-player" x-webkit-airplay="allow" 
        ref={videoEl} controls>
      </video>
    </div>
    </React.Fragment>
  );
}

export default App;

我已经尝试过这个 npm package,但它是用于 video.js,所以在这种情况下它不会工作。

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)