采用阿里云的直播方案,协议采用RTMP和M3U8两种格式,RTMP延迟大约在10-15秒左右,M3U8大约在20-25秒左右,
RTMP需要使用flash播放器,M3U8可以使用原生video标签
需要注意的坑:
    1.开启浏览器的flash *非常重要
    2.需要引入
        require('videojs-flash/dist/videojs-flash')
        require('videojs-contrib-hls/dist/videojs-contrib-hls')
        这2个js
    3.配置自己的flash播放器
        在flash中加入swf: '/static/xxx.swf'
    4.组件beforeDestroy的时候调用dispose方法销毁videojs
        this.$refs.videojs.dispose()

vue使用vue-video-player在直播中的应用的更多相关文章

  1. 【vue】vue +element 搭建项目,vuex中的store使用

    概述: 每一个 Vuex 应用的核心就是 store(仓库).“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state).Vuex 和单纯的全局对象有以下两点不同: Vuex 的 ...

  2. vue不通过路由直接获取url中参数的方法示例

    vue不通过路由直接获取url中参数的方法示例 vuejs取得URL中参数的值地址:http://localhost:3333/#/index?id=128console.log(this.$rout ...

  3. vue学习之路 - 3.基本操作(中)

    基本操作(中) 本章节主要介绍:vue的条件渲染.列表渲染,计算属性和侦听器 条件渲染和列表渲染 条件渲染主要使用到了 v-if 指令,列表渲染主要使用了 v-for 指令. 下面介绍 v-if .  ...

  4. vue --- 解读vue的中webpack.base.config.js

    const path = require('path') const utils = require('./utils')// 引入utils工具模块,具体查看我的博客关于utils的解释,utils ...

  5. 执行 vue inspect > output.js 报错,无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\vue.ps1,因为在此系统中禁止执行脚本

    无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\vue.ps1,因为在此系统中禁止执行脚本.有关详细信息,请参阅 "get-help ab ...

  6. vue第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法)

    第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data ...

  7. vue 在有大数据量的 table 中使用弹窗 input 输入数据时卡顿解决方案

    vue 在有大数据量的 table 中使用弹窗 input 输入数据时卡顿解决方案 原因:vue在进行输入时,进行了多次的render刷新渲染操作,导致了input框输入时发生的卡顿现象 解决方法:在 ...

  8. vue入门 vue与react和Angular的关系和区别

    一.为什么学习vue.js vue.js兼具angular.js和react的优点,并且剔除了他们的缺点 官网:http://cn.vuejs.org/ 手册:http://cn.vuejs.org/ ...

  9. Vue (一) --- vue.js的快速入门使用

    =-----------------------------------把现在的工作做好,才能幻想将来的事情,专注于眼前的事情,对于尚未发生的事情而陷入无休止的忧虑之中,对事情毫无帮助,反而为自己凭添 ...

  10. Vue (三) --- Vue 组件开发

    ------------------------------------------------------------------好心情,会让你峰回路转. 5. 组件化开发 5.1 组件[compo ...

随机推荐

  1. require 4种引入方式的区别

    以下四种引入方式的区别: 自己创建的包里面封装了一些方法,只是把aa文件夹放在了node_modules文件夹里,所以在引用时,不需要写上相对路径,也不能在网上下载 这是网上别人封装好了的包,下载好了 ...

  2. 关于HttpSession 和 Hibernate框架中 session异同点的简单解析

    快速理解: HttpSession中的session是一个容器用来盛基于会话机制的信息. 比喻:我把钱放进银行的保险柜里. 解析:我的钱就是我的信息,ID等 银行的保险柜就是session容器. Hi ...

  3. oracle如何创建存储过程和调用

    oracle存储过程的创建语法 create or replace procedure 存储过程名称 ( --定义输入.输出参数-- 参数名1 in 参数类型, 参数名2 in 参数类型, 参数名3 ...

  4. django数据库的表已迁移的不能重新迁移的解决办法

    django.db.utils.InternalError: (1050, "Table 'tb_content' already exists") mysql数据库在迁移时数据库 ...

  5. java按照指定格式输出系统时间使用SimpleDateFormat方法

    public class TimeThree { public static void main(String[] args) { SimpleDateFormat d = new SimpleDat ...

  6. 使用labelme制作自己的数据集

    # python3 conda create --name=labelme python=3.6 source activate labelme # conda install -c conda-fo ...

  7. ubuntu16.04安装anaconda、环境配置

    anaconda默认3.7降级到3.6 conda install python=3.6 anaconda安装后找不到conda命令: 执行测试命令 conda info -e conda: comm ...

  8. GCP 谷歌云平台申请教程

    最近为了学个国外的课程,想要用谷歌云平台的GPU,谷歌云平台,新注册,赠送300美金,免费用一年.注册的时候发现,必须要有国外的信用卡,网上搜索,并试了几个解决方案. 1.不用信用卡,能不能申请成功? ...

  9. 简易祖玛--canvas

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  10. quartz任务调度框架与spring整合

    Quartz是什么? Quartz 是一种功能丰富的,开放源码的作业调度库,可以在几乎任何Java应用程序集成 - 从最小的独立的应用程序到规模最大电子商务系统.Quartz可以用来创建简单或复杂的日 ...