React Player Thumbnail

Question

i am using react-player for playing videos. Not sure if there are any better options, but this seems to do the job. The only issue i have is, that i need to get thumbnails for the videos. Any idea how i would go around it ?

If you know about some better option for playing videos in React web app with supported thumbnails, that would be also great.

<ReactPlayer                                                    
 className="videoFrame"
 url={url}
 playing
 controls
/>

Thanks

Edit: I ended up using the video itself as thumbnail and blocking all mouse events over it. Then use parent div as button. In case of youtube i replace the video with thumbnail provided by youtube ( https://img.youtube.com ), because of the big play button over video. Most of other players dont have it.

Answer 1

Use the light prop to supply an image URL to the player.

<ReactPlayer                                                    
 className="videoFrame"
 url={url}
 light="http://placekitten.com/200/300"
 playing
 controls
/>