解决传统的FTP上传速度慢容易垮掉的问题，以下为将视频上传到七牛云存储的解决办法，纯web操作。

首先打开七牛云的官方网站。

https://www.qiniu.com/

登录状态下进入管理控制台。

进去之后点击左边的侧边看进入对象存储。

选择一个空间。

进入空间之后选择内容管理

进入之后跳到一个上传文件的页面。

选择指定影片添加即可。

这个软件是支持批量操作的。

用完时候关闭去内容管理找你上传影片的名字。

选择复制外部连接。

然后放在url地址栏查看是否可以播放。

接下来是讲如何展示。

首先进入我们的后台管理系统。

简单介绍一下。

发布文章页面：

填写完常规信息之后就到了文章内容，首先说说视频的两种，标签：

1.视频老式标签。

1
2
3
4
<div style="text-align: center;">
	<iframe allowfullscreen="true" frameborder="0" height="100%" 			src="http://www.cctvzyzg.com/video/%E5%A4%AE%E8%A7%86%E8%A7%A6%E5%AA%92.mp4" width="100%">
    </iframe>
</div>

2.视频新式标签

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<div style="text-align: center;">
    <video 
           src="http://qiniu.weiinng.cn/%E6%88%91%E7%9A%84%E5%BD%B1%E7%89%872.mp4"
           width="800px"
           height="600px"
           autoplay="false"
           loop="false"
           muted="false"
           controls="true"
           page-gesture="true"
           show-fullscreen-btn="true"
           show-center-play-btn="true"
           enable-progress-gesture="true"
           objectFit="cover"
           style="{
                  border: 0;
                  }"
           >
    </video>
</div>
  • src ：必填字段就是视频的播放地址，刚才上传到七牛云并召回来的外链。
  • width：视频的宽度，px结尾。
  • height：视频的高度，px结尾。
  • autoplay：视频是否自动播放。默认false不自动播放，如果修改为true则为自动播放。
  • loop：是否循环播放。默认false不循环播放，如果修改为true则为循环播放。
  • muted：石佛偶静音播放，默认为false不静音模仿，如果修改为ture则为静音播放。

剩下的属性请见下方。

如果不懂请咨询作者。

新式标签内容比较多但是需要修改的没有几处。

所有属性：
属性名 类型 默认值 说明
src String 要播放视频的资源地址
autoplay Boolean false 是否自动播放
loop Boolean false 是否循环播放
muted Boolean false 是否静音播放
initial-time Number 指定视频初始播放位置，单位为秒（s）。
duration Number 指定视频时长，单位为秒（s）。
controls Boolean true 是否显示默认播放控件（播放/暂停按钮、播放进度、时间）
danmu-list Object Array 弹幕列表
danmu-btn Boolean false 是否显示弹幕按钮，只在初始化时有效，不能动态变更
enable-danmu Boolean false 是否展示弹幕，只在初始化时有效，不能动态变更
page-gesture Boolean false 在非全屏模式下，是否开启亮度与音量调节手势
direction Number 设置全屏时视频的方向，不指定则根据宽高比自动判断。有效值为 0（正常竖向）, 90（屏幕逆时针90度）, -90（屏幕顺时针90度）
show-progress Boolean true 若不设置，宽度大于240时才会显示
show-fullscreen-btn Boolean true 是否显示全屏按钮
show-play-btn Boolean true 是否显示视频底部控制栏的播放按钮
show-center-play-btn Boolean true 是否显示视频中间的播放按钮
enable-progress-gesture Boolean true 是否开启控制进度的手势
objectFit String contain 当视频大小与 video 容器大小不一致时，视频的表现形式。contain：包含，fill：填充，cover：覆盖
poster String 视频封面的图片网络资源地址，如果 controls 属性值为 false 则设置 poster 无效

一个文章可以放多个视频任意组合包括图文视频都可以放在一起。但是需要对html语法有一定了解。