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
4
votes
2 answers
react-player and authorization required problem
I am developing an application where server streams some video files and ReactJS-based client can play that stream using react-player.
Everything works great when I'm playing the stream using ordinary url variable from ReactPlayer component. But…
SP5RFD
- 841
- 3
- 17
- 31
3
votes
0 answers
Cannot play video via react-player on iOS devices
We use DigitalOcean spaces as a storage for media files. When I try to play any uploaded video with react-player I only see a crossed-out play button. The problem only occurs on iOS devices both in Chrome and Safari.
screenshot
Here is what my…
Oleksandr Fomin
- 31
- 2
3
votes
2 answers
Pause video when changing slide in react js?
I have a simple slider using react slick slider one of my slides is a video using react player, Now I want if the user changes the slide to pause the playing video here is what I have so far.
Here is a live demo on code sandbox: pause video…
The Dead Man
- 6,258
- 28
- 111
- 193
3
votes
1 answer
Maintain react-player light mode after user clicks on thumbnail
I'm using the light={true} setting in my ReactPlayer component to show a thumbnail on a list of videos. This works fine on the initial load. However, when a user clicks on the thumbnail, I open a modal to play the video (in a separate ReactPlayer…
Scott Bradley
- 31
- 1
- 2
2
votes
1 answer
React-Player Volume change issue
I've been recently working around with React-Player and I'm facing some issues when the volume intensity is changing.
https://github.com/cookpete/react-player
More precisely, for the purpose of the application, the volume of each sound is changed by…
Chstavridis
- 21
- 2
2
votes
1 answer
React Player with vimeo video?
I'm trying to add a vimeo video to my react project. I looked up a simple react player example but only was able to see the thumbnail of the video, it wont actually play. I've tried looking into different methods but I'm pretty lost. If someone…
Peter McClelland
- 33
- 1
- 10
2
votes
2 answers
video seeking is not working in react player
I'm writing an educational website using react.js
As a part of my website, I need to play a video. In this regard I use the ReactPlayer package. The codes are as follows:
import React from 'react'
import ReactPlayer from 'react-player'
function…
Sadegh Eskandari
- 90
- 1
- 4
2
votes
1 answer
React Document Viewer in react (PDF, Images, word file, video file) like slack Viewer
Requirement:
I want a react document viewer for all kinds of file types (PDF, Images, Word, Video),
same as slack has a Document Viewer.
Like Slack, I am building a chat module for my react web app. In which users can upload multiple attachments…
Tanuj Gupta
- 286
- 5
- 20
2
votes
1 answer
react-player youtube player swallows keypress events
I'm using react-player to play youtube videos and have a lot of custom hotkeys defined with react-hotkeys-hook. I've got the following config which prevents the default youtube key handlers from running:
const PLAYER_CONFIG: Config = {
youtube: {
…
will-hart
- 3,742
- 2
- 38
- 48
2
votes
0 answers
How do i hide the controls beside the Play button in React-player?
So i've been trying to hide the controls beside the Play button but with no luck. Does anyone know how I can do this? Also, I would like the controls to appear after "play" has been clicked.
Currently my code simply looks like this:
…
Sermad NaJar
- 135
- 1
- 5
- 15
2
votes
0 answers
Load a data uri string in react-player
I would like to load a data uri string
data:audio/wav;base64,UklGRuR+JwNXQVZFZm10IBAAAAAB
string into a react-player component or any other video player in react.
I only find the possibility to load url from local videos or e.g. youtube.
Hence, my…
Uwe.Schneider
- 1,112
- 1
- 15
- 28
2
votes
1 answer
Google Drive video url is not working for larger files in react player in react js
Code:-
NRA 1
- 137
- 1
- 1
- 10
2
votes
0 answers
Audio playback issue in react-player for iOS after changing nextjs version from 8 to 10
In my Nextjs (v.10) project react-player is used to play mp3 files. I recently updated the project:
"next": "10",
"react": "^17.0.2",
"react-player": "^1.6.6",
In my component I am using react-player like this:
Roman Nozhenko
- 698
- 8
- 21
2
votes
2 answers
How can I start a video at specific timestamp in React?
Here is my component and I want to automatically play it from a certain time like 00:07:12,600, not from the start.
import style from './Hero.module.css';
import Image from 'next/image';
import ReactPlayer from 'react-player';
import { useState }…
moemous
- 159
- 3
- 13
2
votes
2 answers
when displaying videos from an array using .map(), button plays ALL videos instead of selected
I’m displaying an array of YouTube videos in this component (using react-player) and have gotten them to play when the custom play button is clicked, but it plays (and pauses) all of them instead of the currently selected item.
I’m using the useRef…
Nikki Peel
- 67
- 9