React视频播放器

Streaming entertainment is a massive interest of mine as both a consumer and web developer.  My love for streaming entertainment dates back to the early days of RealPlayer and the misery of a million codecs.  Fast forward to today and I'm working a lot with ReactJS, as well as the dozens of streaming technologies like YouTube, Twitch, Facebook, and so on.  That lead me to think:  is there a good open source component for embedding videos from popular video providers?

作为消费者和网络开发人员，流媒体娱乐是我的巨大兴趣。 我对流媒体娱乐的热爱可以追溯到RealPlayer的早期以及百万编码解码器的痛苦。 快进到今天，我正在与ReactJS以及YouTube，Twitch，Facebook等数十种流技术进行大量合作。 这使我想到：是否有很好的开源组件来嵌入流行视频提供商的视频？

Let's check out ReactPlayer, a very simple but useful streaming video player component for ReactJS!

让我们看看ReactPlayer ，这是一个非常简单但有用的ReactJS流视频播放器组件！

View Demo 观看演示

Using the ReactPlayer component is really simple:

使用ReactPlayer组件非常简单：

import ReactPlayer from 'react-player';

class App extends Component {
  render() {
    return (
      <div>
        <ReactPlayer
          url='https://www.youtube.com/watch?v=rnwlWn603g4'
          className='react-player'
          playing
          width='100%'
          height='100%'
        />
      </div>
    );
  }
}

ReactPlayer provides a number of options for both general and service-specific playback, also providing a number of event callbacks and even multi-source playback options.

ReactPlayer提供了许多用于常规和特定于服务的回放的选项 ，还提供了许多事件回调甚至多源回放选项。

ReactPlayer is an awesome utility for embedding popular media sources in your own site.  The config is minimal and you can have any video service up and running in a few minutes.

ReactPlayer是一个很棒的实用程序，用于将流行的媒体源嵌入到您自己的站点中。 该配置非常简单，您可以在几分钟内启动并运行任何视频服务。

翻译自: https://davidwalsh.name/react-video-player