网页视频播放插件

发现阿里云oss储存，上传了视频不能在线播放。

解决方法：使用插件播放即可解决。

<html>

<head>

<meta charset="utf-8">

<title>Video.js 6.2.8</title>

    <link href="http://www.jq22.com/demo/video-js/css/video-js.css" rel="stylesheet">

    <style>

        body{background-color: #191919}

        .m{ width: 740px; height: 400px; margin-left: auto; margin-right: auto; margin-top: 100px; }

    </style>

</head>

<body>

    <div class="m">

        <video id="my-video" class="video-js" controls preload="auto" width="740" height="400"

          poster="m.png" data-setup="{}">

            <source src="这里填写阿里云oss，视频地址" type="video/mp4">

            <p class="vjs-no-js">

              To view this video please enable JavaScript, and consider upgrading to a web browser that

              <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>

            </p>

          </video>

          <script src="http://www.jq22.com/demo/video-js/js/video.min.js"></script>

          <script type="text/javascript">

            var myPlayer = videojs('my-video');

            videojs("my-video").ready(function(){

                var myPlayer = this;

                myPlayer.play();

            });

        </script>

    </div>

</body>

</html>

如果不能播放：

1、这里测试mp4可行，其他请自行测试。

2、检查防盗链,读写权限，是否设置好。

阿里云oss视频上传不能在线播放,js,javascript,在线播放器,插件的更多相关文章

  1. Thinkphp整合阿里云OSS图片上传实例

    Thinkphp3.2整合阿里云OSS图片上传实例,图片上传至OSS可减少服务器压力,节省宽带,安全又稳定,阿里云OSS对于做负载均衡非常方便,不用传到各个服务器了 首先引入阿里云OSS类库 < ...

  2. 构建基于阿里云OSS文件上传服务

    转载请注明来源:http://blog.csdn.net/loongshawn/article/details/50710132 <构建基于阿里云OSS文件上传服务> <构建基于OS ...

  3. PHP实现阿里云OSS文件上传(支持批量)

    上传文件至阿里云OSS,整体逻辑是,文件先临时上传到本地,然后在上传到OSS,最后删除本地的临时文件(也可以不删,具体看自己的业务需求),具体实现流程如下:   1.下载阿里云OSS对象上传SDK(P ...

  4. 记一次阿里云oss文件上传服务假死

    引言 记得以前刚开始学习web项目的时候,经常涉及到需要上传图片啥的,那时候都是把图片上传到当前项目文件夹下面,每次项目一重启图片就丢了.虽然可以通过修改/tomcat/conf/server.xml ...

  5. SpringBoot整合阿里云OSS文件上传、下载、查看、删除

    1. 开发前准备 1.1 前置知识 java基础以及SpringBoot简单基础知识即可. 1.2 环境参数 开发工具:IDEA 基础环境:Maven+JDK8 所用技术:SpringBoot.lom ...

  6. 阿里云OSS文件上传封装

    1.先用composer安装阿里云OSS的PHPSDK 2.配置文件里定义阿里云OSS的秘钥 3.在index控制器里的代码封装 <?php namespace app\index\contro ...

  7. php阿里云oss文件上传

    php的文件上传 文件上传 php的文件上传放在了$_FILES数组里,单文件和多文件上传的区别在于$_FILES['userfile']['name']是否为数组, 不熟悉的可以读一下官方文档 单文 ...

  8. ThinkPHP5使用阿里云OSS图片上传

    1.下载OSS文件放在网站根目录下(OSS文件下载地址:https://gitee.com/jth1234/oss_files.git) 2.在入口文件中加载OSS 3.config文件配置oss信息 ...

  9. file does not exist 阿里云OSS图片上传遇到的问题

    ./uploads\20171209/0497b8dd16e72c6fcf5bfd552f535a81.png file does not exist 原代码 function aliyun($sav ...

随机推荐

  1. 整合使用持久层框架mybatis 使用SqlSessionTemplate模板类与使用映射接口 对比

    spring中整合使用mybatis的用法总结 一:在Spring配置Mybatis 第一步:将mybatis-spring类包添加 到项目的类库中 第二步:编写spring和持久层衔接的xml文件, ...

  2. day 27 Python中进程的操作

    进程的创建和结束: multiprocess模块: multiprocess不是一个模块而是python中一个操作.管理进程的包 分为四个部分:创建进程部分,进程同步部分,进程池部分,进程之间数据共享 ...

  3. [z]nativeSql

    http://blog.csdn.net/chenallen1025/article/details/9169543 EntityManager API 提供了创建 Query 实例以执行原生 SQL ...

  4. Vue-CLI3.x 高版本覆盖低版本Vue-CLI2.x 解决方法

    因为Vue-cli 3 和旧版使用了相同的vue命令,所以Vue CLI 2(vue-cli) 被覆盖了.如果你任然需要旧版本的 vue init 功能 ,你可以全局安装一个交接工具: npm ins ...

  5. 4C - 七夕节

    七夕节那天,月老来到数字王国,他在城门上贴了一张告示,并且和数字王国的人们说:"你们想知道你们的另一半是谁吗?那就按照告示上的方法去找吧!" 人们纷纷来到告示前,都想知道谁才是自己 ...

  6. LOADRUNNER重装经验

    1 装了LR的机器最好不要装UFT,两个工具共用一个配置文件,容易冲突. 2 LR11录制脚本时,支持的浏览器有:IE8及以下版本.FIREFOX,用哪个浏览器录制就要在操作系统中将其设置为默认浏览器 ...

  7. （转）无效的CurrentPageIndex 值。它必须大于等于0 且小于PageCount 解决方案

    第一种: 当以某种条件来查询的时候 其中的结果是以一个结果为条件的datagrid分页 采用字查询到条件下加入如下代码: [c-sharp] view plaincopyprint? protecte ...

  8. eclipse自动添加javadoc注释

    参考文档: https://jingyan.baidu.com/article/36d6ed1f70ea9c1bce488350.html https://www.cnblogs.com/yangji ...

  9. NOI导刊 2018河南郑州游记

    前言 本蒟蒻来自浙江的弱市弱校,因为不想两年\(OI\)一场空,以及想出去玩,所以与同届大佬一起报了\(NOI\)导刊,希望能留下点不错的记忆吧. \(Day\ 0\) \(10\)月\(1\)日 经 ...

  10. OneZero第三周第三次站立会议（2016.4.6）

    1. 时间: 13:05--13:15  共计10分钟. 2. 成员: X 夏一鸣 * 组长 (博客:http://www.cnblogs.com/xiaym896/), G 郭又铭 (博客:http ...