Closed vishalkr058 closed 3 years ago
I'm currently experiencing this same problem if anyone has any ideas that would be of great help.
<ReactHlsPlayer
playerRef={ref}
src={stream}
poster={image}
muted
height={200}
width={355.55}
autoPlay
hlsConfig={{
maxLatency: 10,
maxLoadingDelay: 2,
minAutoBitrate: 0,
lowLatencyMode: true,
}}
/>
@devcshort if u could help on this issues?
It seems this issue was related to unnecessary rerenders.
Firstly if using next, it seems like you HAVE to load ReactHlsPlayer with dynamic imports.
import dynamic from 'next/dynamic';
const ReactHlsPlayer = dynamic(() => import('react-hls-player'));
This fixed the immediate issue but it would occur for me again once the stream loaded. In my case, it was because on stream load I'm updating a status indicator that was causing the player to rerender, so memoizing it solved that issue.
Hi @timcole , Thanks for the response, meanwhile i tried different player and that worked for me.
I am trying to play hls .m3u8 url using react-hls-player but video get interrupted continuously by giving error![image](https://user-images.githubusercontent.com/22008102/129200888-79b36c29-0c1d-4a53-abc6-4bb238491442.png)
Uncaught (in promise) DOMException: The play() request was interrupted by a new load request
in the console. Here is a screenshot of the error.