利用Flex和PHP创建网站视频发布系统 收藏Word格式.docx
- 文档编号:19507823
- 上传时间:2023-01-07
- 格式:DOCX
- 页数:12
- 大小:22.34KB
利用Flex和PHP创建网站视频发布系统 收藏Word格式.docx
《利用Flex和PHP创建网站视频发布系统 收藏Word格式.docx》由会员分享,可在线阅读,更多相关《利用Flex和PHP创建网站视频发布系统 收藏Word格式.docx(12页珍藏版)》请在冰豆网上搜索。
PRIMARYKEY(movieId)
);
要向数据库中添加数据,你需要开发一个HTML上传页面,它可以上传视频,将视频转换成FlashVideo,获得一个缩略图并将这些信息添加到数据库中。
创建上传页面
事实上,创建一个上传视频的HTML页很简单,如下:
addmovie.html
<
html>
body>
formenctype="
multipart/form-data"
method="
post"
action="
upload.php"
>
inputtype="
hidden"
name="
MAX_FILE_SIZE"
value="
300000"
/>
table>
tr>
td>
Title<
/td>
text"
title"
/tr>
Movie<
file"
movie"
/table>
submit"
Upload"
/form>
/body>
/html>
这个页面的表单提交到upload.php页,upload.php会处理视频,抓取缩略图并将数据添加到数据库中。
页面代码如下:
upload.php
?
php
require"
DB.php"
;
functionconverttoflv($in,$out)
{
unlink($out);
$cmd="
ffmpeg-v0-i$in-ar11025$out2>
&
1"
$fh=popen($cmd,"
r"
);
while(fgets($fh)){}
pclose($fh);
}
functiongetthumbnail($in,$out)
ffmpeg-i$in-pix_fmtrgb24-vframes1-s300x200$out2>
functionflv_import($upfile,$fname,$title)
$fname=preg_replace('
/\..*$/'
'
'
basename($fname));
$flvpath="
$fname.flv"
$thumbpath="
$fname.gif"
converttoflv($upfile,"
movies\\$flvpath"
getthumbnail($upfile,"
movies\\$thumbpath"
$dsn='
mysql:
//root@localhost/movies'
$db=&
DB:
:
connect($dsn);
if(PEAR:
isError($db)){die($db->
getMessage());
}
$sth=$db->
prepare('
INSERTINTOmoviesVALUES(0,?
?
)'
$db->
execute($sth,array($title,$flvpath,$thumbpath,300,200));
flv_import($_FILES['
movie'
]['
tmp_name'
],$_FILES['
name'
],$_POST['
title'
]);
Filesucessfullyuploaded
函数flv_import()是脚本代码的核心部分,它调用了converttoflv()函数和getthumbnail()函数来将视频转换成FlashVideo文件和创建缩略图。
然后
当我打开addmovie.html页面的时候,我做了一下截图,见图1.
图1.上传视频的页面
现在你就可以点击Upload按钮上传视频到服务器进行处理了。
upload.php页面中的脚本只是一些很基础的代码。
如果向将其投入使用,你需要添加一些错误验证代码。
这些脚本最大的问题就是处理较大的视频文件的能力。
较大的视频文件需要转换很长时间,用户也需要等待很长时间才行。
为了能够支持大的视频文件(比如长于10秒钟的视频),我建议你简单地将视频复制到一个文件夹中,然后通知用户该视频稍后将会出现在网站上。
然后你可以编写一段脚本来处理该文件夹中的视频。
这里我觉得有必要说明一下为什么要把视频转换成FlashVideo。
当然,在FlashPlayer中我需要使用FlashVideo来观看视频。
但是不只是那样,如果我不进行转换的话就要显示每个视频的播放器是什么,而且还要帮助用户找到并安装适用于他们系统的播放器。
这将需要大量的工作。
将所有的视频转换成FlashVideo的最大优点——同时也是使用Flex编写的FlashPlayer的最大优点——就是它几乎可以在任何地方运行。
下一步就是创建一个类似YouTube的简单的HTML/Flash界面。
创建HTML/Flash界面
在AdobeFlexBuilder™2创建一个新的Flex工程,然后创建一个Flash视频,这个视频通过给定的URL找到视频并播放。
我们将这个Flex应用程序文件命名为simplemovie.mxml,代码如下:
simplemovie.mxml
xmlversion="
1.0"
encoding="
utf-8"
mx:
Applicationxmlns:
mx="
layout="
absolute"
VBoxbackgroundColor="
white"
width="
400"
height="
335"
<
VideoDisplaywidth="
300"
id="
videoPlayer"
source="
{Application.application.parameters.movie}"
HBoxwidth="
100%"
horizontalAlign="
center"
Buttonlabel="
Play"
click="
videoPlayer.play()"
/mx:
HBox>
VBox>
Application>
这个简单的Flex程序包括两部分:
一个用来播放视频的VideoDisplay组件以及一个Play按钮,当视频播放完毕时用户可以点击按钮重新播放。
VideoDisplay组件有一个source属性,它包含了视频FLV文件的URL地址。
在这里,它的值是一个程序变量,这个变量是HTML中的<
object>
或<
embed>
标签的FlashVars属性所提供的。
使用FlexBuilder将simplemovie.mxml编译成simplemovie.swf文件然后将其从bin文件夹中移动到PHP文件目录中。
下面我们将创建一个嵌入了这个视频的PHP页面,该页面代码如下:
simptest.php
$moviebase='
http:
//localhost:
8080/movies/'
$dsn='
$db=&
if(PEAR:
$source=null;
$movieId=1;
if(array_key_exists('
$_GET))
$movieId=$_GET['
];
$movies=array();
$res=$db->
query('
SELECTmovieId,source,titleFROMmovies'
while($row=$res->
fetchrow()){
$movies[]=$row;
if($row[0]==$movieId)
$source=$row[1];
if($source==null)
$source=$movies[0][1];
tdvalign="
top"
objectclassid="
clsid:
D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="
swflash.cab"
paramname="
simplemovie.swf"
quality"
high"
flashVars"
movie=<
phpecho($moviebase.$source)?
"
embedsrc="
quality="
play="
true"
loop="
false"
flashVars="
type="
application/x-shockwave-flash"
pluginspage="
/embed>
/object>
foreach($moviesas$movie){
ahref="
simptest.php?
phpecho($movie[0])?
phpecho($movie[2])?
/a>
br/>
它向数据库中添加了有关视频的一些数据。
有关FLV和缩略图的功能都使用了ffmpeg中的命令行来处理视频。
在上面的代码中,一开始是连接到数据库并获取视频列表。
然后它就开始查找是否有与URL中ID匹配的视频ID,如果有匹配的视频ID,它就会将这个ID赋值给movie变量并通过flashVars参数传送到simplemovie.swf文件。
接下来,在HTML代码中创建了<
和<
标签用来嵌入simplemovie.swf,标签中也提供了视频的正确URL地址。
然后又创建了一个列表列出了所有可用的视频,这个列表中的每一项都提供了它们对应视频的正确ID并链接到了本页。
在浏览器中运行这个页面的结果如图2:
图2.简单的视频播放器和视频列表
当我打开页面的时候第一个视频开始播放。
当我选择右边列表中的某个视频的时候,页面就会重新载入并播放选中的视频。
是不是很简单?
一个Flex文件,一个PHP文件再加上后台的一点数据库操作,哇!
一个视频分享网站出现了!
接下来我们将在Flex中做一些工作来增强用户体验。
Flex界面,第一部分
如果你想让Flex播放视频,你必须向Flex程序提供视频列表。
最简便的方法就是通过XML。
所以,现在我们要返回PHP的部分,编写一个可以将数据库中的视频列表抽取到XML文件的页面。
movies.php就实现了这个功能,代码如下:
movies.php
header('
content-type:
text/xml'
movies>
SELECTtitle,source,thumb,width,heightFROMmovies'
movietitle="
phpecho($row[0])?
phpecho($moviebase.$row[1])?
thumb="
phpecho($moviebase.$row[2])?
phpecho($row[3])?
phpecho($row[4])?
/movies>
你可以通过命令行运行它然后查看生成的XML,也可以在浏览器中打开这个页面然后你就可以看到以树形方式显示的XML,见图3:
图3.视频的XML列表
有了这个XML列表,我们就可以创建一个扩展自simplemovie.mxml的Flex程序,代码如下:
mytube1.mxml
creationComplete="
movieXmlData.send()"
HTTPServicemethod="
get"
url="
8080/movies.php"
movieXmlData"
result="
onGetMovies(event)"
Script>
importmx.rpc.events.ResultEvent;
importmx.controls.VideoDisplay;
importmx.controls.List;
importmx.rpc.http.HTTPService;
importmx.collections.ArrayCollection;
[Bindable]
privatevarmovies:
ArrayCollection=newArrayCollection();
publicfunctiononGetMovies(event:
ResultEvent):
void
varfirstMovie:
String=event.result.movies.movie[0].source.toString();
videoPlayer.source=firstMovie;
movies=event.result.movies.movie;
movieList.selectedIndex=0;
publicfunctiononPrevious():
if(movieList.selectedIndex==0)
movieList.selectedIndex=movies.length-1;
else
movieList.selectedIndex-=1;
videoPlayer.source=this.movieList.selectedItem.source.toString();
publicfunctiononPlay():
videoPlayer.play();
publicfunctiononNext():
if(movieList.selectedIndex>
=(movies.length-1))
movieList.selectedIndex+=1;
publicfunctiononChange():
paddingLeft="
10"
paddingTop="
paddingRight="
complete="
onNext()"
onPrevious()"
onPlay()"
Listwidth="
340"
movieList"
dataProvider="
{movies}"
change="
onChange()"
labelField="
List>
明显的变化就是页面上半部分添加了很多ActionScript代码,它们用来管理界面。
这些代码首先在onGetMovies()使用HTTPService从movies.php中读取XML。
当HTTPService类检测到XML时会立刻返回一个XML文档对象模型(DOM),然后我们就可以使用这个DOM来读取第一个视频并播放它。
函数onGetMovies()还设定了一个movies变量来存储列表框中要显示的视频。
ActionScript代码中的其它方法处理界面可能触发的不同事件,例如用户点击了视频列表、点击了“上一个”或“下一个”按钮等等。
最下面的代码是一些组成用户界面的Flex组件。
其中有一些按钮——左箭头和右箭头——来切换到下一个或上一个视频。
在VideoDisplay的右边有一个视频列表,在这里该列表只是列出了视频的名字。
使用Flex编译并运行程序,结果如图4:
图4.Flex用户界面的第一个版本
现在我们可以使用右边的列表来选择视频,或者通过按下左/右按钮在视频之间切换。
这个程序已经相当不错了,不过我们的缩略图在哪里使用了呢?
Flex界面,第二部分——添加了缩略图
要在列表中使用缩略图,你需要对列表做一下更
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 利用Flex和PHP创建网站视频发布系统 收藏 利用 Flex PHP 创建 网站 视频 发布 系统