http://blog.csdn.net/leixiaohua1020/article/details/15811977/
本文记录一个最简单的视频网站系统。此前做过一些基于JavaEE中的 SSH (Strut2 + Spring + Hibernate)的网站系统，但是一直没有做过一个视频网站系统，所以就打算做一个“精简”的视频网站系统，以方便以后测试以及学习使用。本视频网站支持直播（通过RTMP实现）和点播（通过HTTP实现）。为了保持精简，这个视频网站系统仅制作了网络视频的管理功能（增删改查），以及相关的参数配置功能。由于自己在JavaEE方面没有深入学习过，所以这个系统有部分功能还没搞完，以后有时间再慢慢完善。
简介
架构
系统前台显示采用了Div + CSS+ Javascript技术。其中前台显示用了一些Javascript插件，例如说生成旋转灯笼式效果的CloudCarousel，生成导航菜单的 ddsmoothmenu，用于表单验证的jQuery Validation Engine等等。其中视频播放器用了FlowPlayer（包含了RTMP插件）来支持HTTP的点播和RTMP的直播。按理说视频文件上传的时候可以使用Ajax实现，但是考虑工作比较繁琐，所以暂时还是使用直接文件上传的方式。
系统的后台使用了JavaEE系统中最传统的三层架构：Action层，Service层以及DAO层。其中Action层使用了Struts2框架，用于处理前台页面传来的请求；DAO层使用了Hibernate框架，用于和数据库的交互。Spring框架则用于将Action层，Service层以及 DAO层整合起来。系统的前后台交互主要使用了JSTL标签和EL表达式。此外考虑到国际化方面的要求，采用了Struts2的i18n方式，将所有页面上的文字都抽取坐来保存到单独的文件中，这样就可以实现多种语言的显示。
系统开始运行后，会开启两个线程VideoThumbnailThread和VideoTranscoderThread。 VideoThumbnailThread用于截取视频的缩略图，VideoTranscoderThread则用于转码上传的视频。这两个线程都是通过调用ffmpeg.exe完成相应的功能。
此外，系统中还包含了查看媒体信息的功能。该功能通过调用MediaInfo.dll完成，不再详述。
整个系统的框架如下图所示，后文中再详细记录每部分的功能。
效果
系统主要包含了以下几个页面：
主页（index.jsp）：进入系统的第一个页面。
视频列表（videolist.jsp）：列表显示视频资源的页面。按照视频源的类型的不同可以分为点播（VOD）视频列表和直播（Live）视频列表。
视频编辑（videoedit.jsp）：编辑视频资源的页面。按照视频源的类型的不同可以分为点播（VOD）编辑和直播（Live）编辑。按照操作的不同可以分为添加（Add）和编辑（Edit）。
视频内容（videocontent.jsp）：查看视频的内容的页面。按照视频源的类型的不同可以分为点播（VOD）视频内容和直播（Live）视频内容。
设置（configure.jsp）：设置页面。用于配制系统的参数。
关于（about.jsp）：显示系统相关的一些信息的页面。
首页
网站首页的如下图所示。Logo位于左上角，菜单栏位于右上角。为了美观一些，页面上方做了一个灯箱效果的特效，随机显示一些视频的缩略图。页面下方则分别列出“点播列表”和“直播列表”中最近添加的几个视频。
点播列表
点播列表页面如下图所示。在该页面中，可以对点播视频进行简单的管理：查看内容，添加，修改以及删除。
直播列表
点播列表页面如下图所示。直播列表实质上使用了和点播列表相同的页面。在该页面中，可以对直播视频进行简单的管理：查看内容，添加，修改以及删除。
视频内容页面
视频内容页面如下所示。该页面中包含了一个FlowPlayer播放器，该播放器用于播放视频内容。
点播视频内容页面如下所示。
直播视频内容页面如下所示。尽管表面上看点播和直播页面完全相似，但是实际上点播和直播的机制是不一样的。点播依靠的是HTTP渐进式下载，而直播依靠的是FlowPlayer的RTMP组件。
视频添加页面
点播视频添加页面如下所示。该页面用于上传一个点播视频。“名称”输入框用于指定视频的名称，“文件”用于指定上传的视频文件，“简介”可以指定针对该视频的一段简介。其中，“名称”和“文件”两个输入框为必填项，否则无法提交该页面的表单。
直播视频添加页面如下所示。从图中可以看出直播和点播的添加页面很类似。它们的不同在于：点播是上传一个视频文件，而直播是指定一个URL（目前该URL只支持RTMP）。和点播类似，“名称”和“URL”两个输入框为必填项，否则无法提交该页面的表单。
视频编辑页面
点播视频编辑页面如下所示。该页面用于编辑已经完成上传的点播视频的信息。
直播视频编辑页面如下所示。该页面用于编辑直播视频的信息。
配置
系统的配置页面如下图所示。该页面用于配置系统的各种设置（以转码设置为主）。每次配置完成后重启系统后设置生效。包含以下参数。
- 视频编码器：转码使用的视频编码器，默认值为“libx264”。
- 视频码率 (bps) ：视频编码的码率（单位为bps），默认值为500000（500kbps）。
- 视频帧率 (fps) ：视频编码的帧率（单位为fps），默认值为25。
- 音频编码器：转码时候使用的音频编码器，默认值为“libmp3lame”。
- 音频采样率 (Hz) ：音频编码的采样率（单位为Hz），默认值为22050（22.05kHz）。
- 音频码率 (bps) ：音频编码的码率（单位为bps），默认值为64000（64kbps）。
- 视频宽 (pixel) ：转码后视频的宽（单位为pixel），默认值为640。
- 视频高 (pixel) ：转码后视频的高（单位为pixel），默认值为360。
- 使用水印：选择转码后的视频是否加水印。如果该选项选择“是”，则会在转码后的视频中添加水印。
- 水印文件路径：水印文件的路径，此处为文件相对于网站根目录的路径，默认为“watermark/svw.png”。
- 水印位置-x坐标 (pixel) ：水印在视频中的位置——x坐标（单位为pixel），默认值为5。
- 水印坐标-y坐标 (pixel) ：水印在视频中的位置——y坐标（单位为pixel），默认值为5。
- 保持宽高比并且填充黑边：选择转码后是否保持宽高比。如果该选项选择“是”，则转码后的视频会保持宽高比，并且当输入和输出视频宽高比不一样的时候，会在输出视频中添加黑边。如果该选项选择“否”，则转码后的视频会拉伸成输出分辨率。
- 输出视频封装格式：输出视频的封装格式，默认为“flv”。
- 视频截图位置 (sec) ：获取视频缩略图的位置（单位为sec），默认为5sec。该默认值的含义是获取视频第5秒处的视频帧作为视频的缩略图。
- 上传视频存放文件夹：用于存放上传的视频文件，默认值为“videoori”。
- 转码视频存放文件夹：用于存放转码的视频文件，默认值为“video”。
- 视频截图存放文件夹：用于存放视频的截图，默认值为“videothumbnail”。
MediaInfo信息
MediaInfo信息位于视频内容页面中，在默认的情况下是不显示的。通过修改网页中代码可以显示视频的MediaInfo信息。
转码前文件信息如下图所示，从图中可以看出转码前的文件格式是MPEG-PS，视频编码为MPEG-1，音频编码为MP2。
转码后文件信息如下图所示，从图中可以看出转码前的文件是FLV格式的，视频编码为H.264，音频编码MP3。
多国语言
本系统支持多国语言。选择右上角菜单的“语言”->“English”可以将系统切换到英文。英文界面如下图所示。
英文版的视频点播列表如下图所示。
英文版的视频内容页面如下图所示。
英文版的配置界面如下图所示。
网站部分
下面简单记录一下网站部分的关键源代码。分成三个部分：数据库、前台和后台。
数据库
系统包含了4张表：video，videostate，category，configure。下面简单记录每个表的含义。
Video表
Video表用于存储视频记录。每一个视频对应Video表中的一条记录。该表中的字段如下表所示。
备注
*其中点播视频的URL为视频文件的相对路径。
下面例举Video表中的几项和URL有关数据（受限于篇幅，省略其它字段）。
Videostate表
Videostate表用于存储视频的状态。该表中字段如下表所示。
目前按照执行的顺序定义了4种状态：等待上传，等待截图，等待转码，完成。其中“CSS样式”用于辅助显示视频的状态。该表的内容如下
Category表
Category表用于存储视频的分类。该表可以用于确定视频的分类，目前还没有做太多开发。
Configure表
Configure表用于存储系统配置信息。该表中字段如下表所示。
该表的内容如下。
前台
前台部分没有太多可以记录的，基本上都是各种DIV和CSS的调整。其中使用了较多的JSTL标签以及EL表达式。此外使用了Struts2标签用于支持国际化。基本的jsp页面只有6个：
index.jsp：首页。
videolist.jsp：视频列表——直播视频列表，点播视频列表。
videoedit.jsp：视频编辑——直播视频添加，直播视频编辑，点播视频添加，点播视频编辑。
videocontent.jsp：视频内容——直播视频内容，点播视频内容。
configure.jsp：配置页面。
about.jsp：关于页面。
除了基本页面之外，还有一些辅助页面：
cfooter.jsp：页脚。
cheader.jsp：标题栏。
csidebar_recent.jsp：侧边栏（最近添加）。
error.jsp：错误页面。
FlowPlayer播放器
前台页面中用于视频播放的播放器是FlowPlayer。FlowPlayer播放器安装有3个步骤：
（1）包含FlowPlayer的Js文件
（2）添加一个标记
（3）添加一段Javascript代码，其中要包含FlowPlayer的Swf文件
FlowPlayer通过HTTP播放点播视频文件的源代码如下所示。${video.url}中保存了视频的相对URL。
FlowPlayer 通过RTMP播放直播视频文件的示例代码如下所示。${video.url}中保存了视频的URL。播放RTMP的时候用到了FlowPlayer的 RTMP Plugin。需要注意的是，RTMP的URL需要拆分开来分别填到不同的位置。在这里通过split(‘/’)函数按照“/”将字符串分离为字符串数组。然后将“protocol://server/app”填至plugins的netConnectionUrl字段，playpath填至clip的 url字段。
