Open sopaidar opened 4 years ago
Hello I'm using video.js-vr to play hls livestreams. this is my code:
import React from 'react'; import videojs from 'video.js' import './videojs-vr'; import axios from 'axios'; import config from '../../server/config/default'; export default class VideoPlayer extends React.Component { constructor(props) { super(props); this.state = { stream: false, videoJsOptions: null } } componentDidMount() { axios.get('/user', { params: { username: this.props.match.params.username } }).then(res => { this.setState({ stream: true, videoJsOptions: { autoplay: false, controls: true, sources: [{ src: '../../live/' + res.data.stream_key + '/index.m3u8', type: 'application/x-mpegURL' }], fluid: true, } }, () => { this.player = videojs(this.videoNode, this.state.videoJsOptions, function onPlayerReady() { console.log('onPlayerReady', this) const player = this player.vr({ projection: '360', debug: true, forceCardboard: false }) }); }); }) } componentWillUnmount() { if (this.player) { this.player.dispose() } } render() { return ( <div className="row player"> <div className="col-xs-12 col-sm-12 col-md-10 col-lg-8 mx-auto mt-5"> {this.state.stream ? ( <div data-vjs-player> <video ref={node => this.videoNode = node} id="videojs-vr-player" className="video-js" controls /> </div> ) : ' Loading ... '} </div> </div> ) } }
It's OK on my chrome on PC but when I try to open it on my android phone chrome, it has this error: your browser/device does not support hls 360 video. See http://webvr.info for assistance.
crossorigin="anonymous"
Hello I'm using video.js-vr to play hls livestreams. this is my code:
It's OK on my chrome on PC but when I try to open it on my android phone chrome, it has this error: your browser/device does not support hls 360 video. See http://webvr.info for assistance.