加载优化

1. head中的加载拉到body下面执行优先渲染页面，减少页面空白时间
3. 图片资源文件体积减少（如登录页背景页）
4. ~~减少cesium.js体积（试着寻找cesium.min.js）~~
5. 资源文件预加载（如登录页背景图）
6. 压缩app.js和app.css文件的体积

介绍

简介

HLSVideo.js是支持了两种播放模式(flash:基于ckplayer.js开发，webRTC:基于kurento-utils.min.js)

功能点

• 初始化视频
• 视频单播及组播功能
• 视频点击功能实现
• 视频断开自动重连

使用

安装

$ npm install hls-video

引入

import {HLSVideo,WSVideo,VWPVideo} from 'hls-video'

//flash播放
let hlsVideo = new HLSVideo({
    el: 'video',
    url: 'http://106.120.131.69:10328/mag/hls/8ef4192b2c5945a2b0107ec84ae3d57a/0/live.m3u8',
    click: (obj) => {
      console.log(obj)
     
    },
    loaded: (obj) => {
      console.log('onLoadedonLoadedonLoadedonLoaded', obj)
    }
})

// webRTC播放
let wsVideo = new WSVideo({
  el: 'video',
  url: 'ws://101.68.79.42:18099/signal',
  code: 'hik01',
  stream: 0,
  click: (obj) => {
    console.log(obj)
  },
  loaded: (obj) => {
    console.log('onLoadedonLoadedonLoadedonLoaded', obj)
  }
})
  
// VWPVideo 播放
this.palyer = new VWPVideo({
  el: 'video',
  url: '004f33e75a2a476d97a70fc4f418236b',
  code: 'hik01',
  stream: 0,
  option: {
    appkey: '22172574',
    secret: 'wjtWJdLkhHbgX3lyxRPt',
    ip: '150.129.138.93',
    port: 443,
    playMode: 0, //播放模式 0-预览 1-回放
    startTime: '2019-08-02 00:00:00',  // 回放开始时间 注意时间格式
    endTime: '2019-08-02 23:59:59'  // 回放结束时间 注意时间格式
  }
})
  

API

play

播放视频

remove

移除视频模块（暂停播放也是调用此方法）

fullScreen

全屏播放视频

Example

DEMO

API

暂未编写