#研发六部 - 数字企业线 视频播放组件（ISC 萤石云 flash flv） Current version: 0.0.1

• 页面需要引入 jsencrypt.min.js jsWebControl-1.0.0.min.js
• 页面onload时 需要 如下代码

<script>
    window.onload = function () {
      WebCameraInit && WebCameraInit()
    }
</script>

变更记录

• 历史版本记录

hikplayer 海康OCX 播放控件js

import React, {useRef, useState} from 'react';
import {Button, Space} from 'antd';
import ReactDOM from 'react-dom';
import PmPlayer from '../../src/index';
import 'antd/dist/antd.css';

const {Hikplayer} = PmPlayer;
const config = {
  appSecret: 'UD1sMwCKgOO0UV3H6lkH',
  appKey: '21046550',
  host: '172.16.8.66',
  port: 443,
};
const cameraUuidArray = ['caf8838a8d9445ec966c67c2938ef004',];
const Index = () => {
  const [playback, setPlayback] = useState(false);
  const isc = useRef(null);

  return (
    <div style={{padding: 20}}>
      <Hikplayer
        ref={isc}
        width={800}
        height={600}
        streamMode={0}
        cameraUuidArray={cameraUuidArray}
        layout='1x1'
        config={config}
      />
    </div>
  )
};
ReactDOM.render(<Index/>, document.getElementById('container'));

operatePlayer 视频播放集成组件，包含 H5、OCX 两种播放模式； 相关接口调用视频中心接口； 包含回放、云台、切换播放模式、抓拍功能

/*
 * @params videoObj:{
 *    cameraName:摄像头 name
 *    cameraUuid:摄像头uuid,
 *    platformType:camera平台类型 根据平台类型 判断播放方式 1 OCX; 3 H5
 *    appKey : ISC 播放参数
 *    appSecret : ISC 播放参数,
 *    host : ISC 播放参数
 *    videoW : 视频区域宽度
 *    videoH ：视频区域高度
 *    platformId : 平台Id 
 *    platformType : 平台类型
/

import React from 'react';
import VideoPlayer from "gddnvideoplayer/src/pages/operatePlayer";
const SESSIONKEY = "session_gddn_player_tower_video";

export default function(videoObj) {
   const {
    appKey,
    appSecret,
    cameraName,
    cameraUuid,
    host,
    platformId,
    platformType,
    videoH,
    videoW,
    ptzControl
  } = videoObj;

  const cameraParam = {
    cameraName,
    cameraUuidList: [cameraUuid],
    platformType,
    platformId,
    streamMode: 0
  };

  const operateParam = {
    playBack: false,
    capability: ptzControl,
    sessionKey: SESSIONKEY
  };

  const iscConfig = {
    appKey,
    appSecret,
    port: +host?.split(":")[1] || 443,
    host: host?.split(":")[0]
  };

  const data = {
    operateParam,
    iscConfig,
    cameraParam,
    width: videoW,
    height: videoH
  };


  return (
    <section style={{ width: '100vw', height: '100vh', background: '#000' }}>
     <VideoPlayer {...data} />
    </section>
  );
}