视频播放器

import React from 'react';

class Player extends React.Component {

constructor(props) {

super(props);

}

componentDidMount() {

if(!window.polyvLivePlayer){

this.loadScript('https://player.polyv.net/resp/live-h5-player/latest/liveplayer.min.js')

.then(() =>{

this.loadPlayer();

});

}

}

componentWillUnmount() {

if(this.player){

this.player.destroy();

}

}

loadPlayer() {

this.player = window.polyvLivePlayer({

wrap: '.player',

width: '100%',

height: '100%',

uid: 'uid',

vid: 'vid',

});

}

loadScript(src) {

const headElement = document.head || document.getElementsByTagName('head')0;

const _importedScript = {};

return new Promise((resolve, reject) => {

if (src in _importedScript) {

resolve();

return;

}

const script = document.createElement('script');

script.type = 'text/javascript';

script.onerror = err => {

headElement.removeChild(script);

reject(new URIError(`The Script ${src} is no accessible.`));

}

script.onload = () => {

_importedScriptsrc = true;

resolve();

}

headElement.appendChild(script);

script.src = src;

})

}

render() {

return (

<div className="wrap">

<div className="player"></div>

</div>

)

}

}

export default Player;

相关推荐
定栓1 分钟前
Webpack迁到Vite第六节:构建配置详解(vite.config.js)
前端·javascript·webpack
voipmaker22 分钟前
融合通信调度录音的困局:基于 MediaX 网关实现对讲语音 AI 事件萃取
人工智能·ai·音视频·语音识别·实时音视频·信息与通信·iot
Sayai9 小时前
ComfyUI+混元视频实战:12G 显存跑 13G 模型,5 分钟出片(国产开源,附模型与工作流)
人工智能·aigc·音视频·comfyui·hunyuanvideo·混元视频
远离UE49 小时前
UE5 Substrate Thin Film 源码拆析
开发语言·javascript·ue5
keyipatience10 小时前
JavaScript学习(1)书写位置,变量、数据类型、运算符
开发语言·前端·javascript·css·学习
ACP广源盛1392462567311 小时前
项目评估记录:4K 视频墙方案调研,GSV9001E @ACP参数与工程问题记录
硬件架构·音视频·硬件工程·视频·国产芯片
小天源13 小时前
智叟云集系统架构解析:从品牌 AI 可见度监测到前后端协同
人工智能·react.js·系统架构·node.js·react·ai监测·ai品牌监测
SensorFlow14 小时前
曝光埋点别放在组件渲染里:连续可见与去重范围怎么验收
javascript
harris148154352975814 小时前
能解码不等于能信任:JWT 的签名到底验的是什么
javascript
liqingdi43714 小时前
[SWPUCTF 2023 秋季新生赛]Easy SMC
服务器·前端·javascript