react-player is a React component for playing a variety of URLs, including file paths, YouTube, Facebook, Twitch, SoundCloud, Streamable, Vimeo, Wistia, Mixcloud, DailyMotion and Kaltura. More information can be found at https://github.com/CookPete/react-player.
Questions tagged [react-player]
213 questions
24
votes
6 answers
React.js - react-player how to play local video
I am currently trying to play a video on local host in react.js. I am using the react-player module to create a video player component. I am able to play videos using urls such as youtube and facebook links but I am unable to use local videos using…
Alan Abraham
- 241
- 1
- 2
- 3
12
votes
2 answers
Trying to use react-player throws a Hydration error
Hi how are you? I'm trying to use react-player in my Next.js app without any luck.
This code
import ReactPlayer from "react-player";
const Home = () => {
return (
10
votes
4 answers
React Player Thumbnail
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…
CosmicSeizure
- 1,375
- 5
- 17
- 35
8
votes
1 answer
React Player add custom play button and overlay img
I'm using ReactPlayer plugin for my react website. I want to add custom play button and overlay image over the vimeo video follow the below image.
When I click play button overlay image and button need to hide and video start play.
Player Link here:…
Saravana
- 3,389
- 4
- 21
- 37
8
votes
3 answers
Building for production causes errors in module package.json
Not sure what's going on, when I do a prod build ("cross-env NODE_ENV=production API_V=production npm run build") I get this error from from react-player:
ERROR in ./node_modules/react-player/lib/ReactPlayer.js Module build
failed:…
meds
- 21,699
- 37
- 163
- 314
7
votes
0 answers
How can we stream a rtmp url in react js?
I need to integrate RTMP player in my reactjs app.I'm getting rtmpUrl for streaming and tried with react player but it is not supporting rtmp url.
Jisha Techversant
- 144
- 2
- 11
6
votes
2 answers
Keeping react-player full-screen mode between videos
I am building an online course website.
When the user watches a lesson in full-screen mode, I want to remember that, so as to use full-screen mode when I mount react-player with the next lesson. I hoped there would be an onFullscreenMode callback,…
AlwaysLearning
- 7,257
- 4
- 33
- 68
5
votes
1 answer
how to add custom styles to the controls provided by react-player?
I need to customize my own style to the controls provided by react-player
https://www.npmjs.com/package/react-player
please can anybody help?
Kritish Bhattarai
- 1,501
- 15
- 20
4
votes
4 answers
Change height and width of a React Player thumbnail using light prop
I set the thumbnail of the React Player using the light prop. Example code is as follows.
Charlie
- 65
- 6
4
votes
3 answers
react-player: Is there a way to change video resolution with custom controls?
I am working on a custom video player that streams videos from different sources (YouTube, Vimeo, etc.) using react-player, and it already has functioning controls that I set up like play/pause, volume/mute, progress bar, and full screen.
I am…
otran
- 41
- 1
- 3
4
votes
4 answers
Pause other video if selected video is playing in react
I'm using react-player https://github.com/cookpete/react-player to play my videos. My problem is, how can I pause other videos while selected video is playing?
const videoRef = useRef();
const updateVideoHandler = async (videoId, videoTitle) => {
…
Joseph
- 7,042
- 23
- 83
- 181
4
votes
0 answers
How do you allow buffering up to a certain timestamp with react-player?
If you want a video streaming an hls or mpeg-dash stream to only play up to a certain timestamp and stop playing/buffering after that timestamp, how would you do that using react-player?
sdfsdf
- 5,052
- 9
- 42
- 75
4
votes
3 answers
Video is not auto playing on IOS by using react-player npm
I want to play video when user comes to the page, it is working fine for all the platform except IOS.
I am using react-player npm. I have tried by passing muted property but doesn't work.
My code looks like this
Shivam Kubde
- 545
- 1
- 8
- 17
4
votes
3 answers
How to stop React Player from playing when close modal?
I am using React Player npm install for React project. The video player is in a modal. How do I stop it from playing when the modal closes? Is there a ReactPlayer.stop() or a ReactPlayer.pause() type of functionality that I can add in my hideModal…
Elaine
- 383
- 1
- 5
- 10
4
votes
1 answer
Cross-Origin Read Blocking (CORB) blocked cross-origin response on React app
I'm running a simple app on React to display audio tracks from files I have uploaded on https://my.pcloud.com/ using the React-Player component.
However, the track doesn't display and I receive the following error on my console:
"Cross-Origin Read…
user11186642
- 41
- 2
- 3