搜尋

flv+php视频网站制作攻略

1#

发表于 2008-11-14 19:55 | 只看该作者 | 倒序看帖 | 打印

flv视频网站制作 使用Flex和PHP创建自己的视频应用英文原文:Creating MyTube with Flex and PHP
原文地址:
http://www.onlamp.com/pub/a/php/ ... h-flex-and-php.html
原文作者:Jack Herrington

随着宽带的普及、硬盘空间的价格持续降低以及Adobe® Flash® Player 和 Flash Video的实用性,视频分享在互联网上疯狂流行是不足为奇的。像Google video 和 YouTube 这样的站点是领头羊,而现在已经到处都是小型的视频分享站点了。那么,如何才能加入到潮流中去呢?如何利用像PHP, Flash和Adobe Flex? 等技术来创建自己的视频分享网站?行动起来吧,它比你想象的要容易得多。

本文将告诉你如何创建网站的PHP部分以及如何使用Flex框架创建一个视频播放器。要创建一个YouTube的简单版本(我们可以称它为MyTube),你需要有一些适当的工具。

在服务器端,你需要PHP 和 MySQL。MySQL是用来存储有关视频的数据的(比如视频的文件名,缩略图,缩略图的高度和宽度,标题和描述)。PHP将完成格式化页面的工作,包括HTML和XML页面,这取决于你想要怎么做。

你还需要一个开源的软件:ffmpeg,它可以将用户上传的任何格式的视频文件转换成Flash Video文件(FLV)。当你向用户展示一个可用的视频列表时,这个 ffmpeg 软件还可以生成视频中某一帧的缩略图。毫无疑问,在视频分享的世界中ffmpeg 会是你最好的助手。它是一个功能强大、易于使用而且文档齐全的极为优秀的软件。

在客户端,有几种不同的用户界面可供选择。第一种就是类似于YouTube的HTML/Flash混合式的用户界面,另外一种就是完全基于Flash的用 户界面。这里我选择了Flex框架来创建一个Flash程序,这个程序首先播放视频,然后会列出一个可用视频的列表并提供导航。

创建PHP后台

创建后台的程序之前,你必须先在MySQL建立一些数据库模式(schema)。首先,创建一个数据库,你可以使用mysqladmin命令行: 复制内容到剪贴板 代码:mysqladmin create movies
完成之后,将模式加载到数据库,模式文件内容如下:

movies.sql 复制内容到剪贴板 代码:DROP TABLE IF EXISTS movies;
CREATE TABLE movies (
movieId INTEGER NOT NULL AUTO_INCREMENT,
title VARCHAR( 255 ),
source VARCHAR( 255 ),
thumb VARCHAR( 255 ),
width INTEGER,
height INTEGER,
PRIMARY KEY( movieId )
);
要向数据库中添加数据,你需要开发一个HTML上传页面,它可以上传视频,将视频转换成Flash Video,获得一个缩略图并将这些信息添加到数据库中。



创建上传页面
事实上,创建一个上传视频的HTML页很简单,如下:
addmovie.html 复制内容到剪贴板 代码:







Title
Movie





这个页面的表单提交到 upload.php 页,upload.php 会处理视频,抓取缩略图并将数据添加到数据库中。页面代码如下:
upload.php 复制内容到剪贴板 代码:

require "DB.php";
  
function converttoflv( $in, $out )
{
  unlink( $out );
  $cmd = "ffmpeg -v 0 -i $in -ar 11025 $out 2>&1";
  $fh = popen( $cmd, "r" );
  while( fgets( $fh ) ) { }
  pclose( $fh );
}
  
function getthumbnail( $in, $out )
{
  unlink( $out );
  $cmd = "ffmpeg -i $in -pix_fmt rgb24 -vframes 1 -s 300x200 $out 2>&1";
  $fh = popen( $cmd, "r" );
  while( fgets( $fh ) ) { }
  pclose( $fh );
}
  
function flv_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( 'INSERT INTO movies VALUES ( 0, ?, ?, ?, ?, ? )' );
  $db->execute( $sth, array( $title, $flvpath, $thumbpath, 300, 200 ) );
}
  
flv_import( $_FILES['movie']['tmp_name'], $_FILES['movie']['name'], $_POST['title'] );
?>
File sucessfully uploaded

函数flv_import()是脚本代码的核心部分,它调用了converttoflv() 函数和 getthumbnail()函数来将视频转换成Flash Video文件和创建缩略图。然后它向数据库中添加了有关视频的一些数据。有关FLV和缩略图的功能都使用了 ffmpeg 中的命令行来处理视频。
当我打开addmovie.html 页面的时候,我做了一下截图,见图1.


图1.上传视频的页面

现在你就可以点击 Upload 按钮上传视频到服务器进行处理了。
upload.php 页面中的脚本只是一些很基础的代码。如果向将其投入使用,你需要添加一些错误验证代码。这些脚本最大的问题就是处理较大的视频文件的能力。较大的视频文件需要转换很长时间,用户也需要等待很长时间才行。
为了能够支持大的视频文件(比如长于10秒钟的视频),我建议你简单地将视频复制到一个文件夹中,然后通知用户该视频稍后将会出现在网站上。然后你可以编写一段脚本来处理该文件夹中的视频。
这里我觉得有必要说明一下为什么要把视频转换成Flash Video。当然,在Flash Player中我需要使用Flash Video来观看视频。但是不只是那样,如果我不进行转换的话就要显示每个视频的播放器是什么,而且还要帮助用户找到并安装适用于他们系统的播放器。这将 需要大量的工作。将所有的视频转换成Flash Video的最大优点??同时也是使用Flex编写的Flash Player的最大优点??就是它几乎可以在任何地方运行。
下一步就是创建一个类似YouTube的简单的 HTML/Flash 界面。



创建 HTML/Flash 界面
在Adobe Flex Builder? 2创建一个新的Flex 工程,然后创建一个Flash视频,这个视频通过给定的URL找到视频并播放。我们将这个Flex应用程序文件命名为simplemovie.mxml,代码如下:
simplemovie.mxml 复制内容到剪贴板 代码:



       source="{Application.application.parameters.movie}" />
  
   
  



这个简单的Flex程序包括两部分:一个用来播放视频的VideoDisplay组件以及一个Play 按钮,当视频播放完毕时用户可以点击按钮重新播放。
VideoDisplay 组件有一个 source 属性,它包含了视频FLV文件的URL地址。在这里,它的值是一个程序变量,这个变量是HTML中的标签的FlashVars属性所提供的。
使用Flex Builder将simplemovie.mxml编译成simplemovie.swf文件然后将其从bin文件夹中移动到PHP文件目录中。下面我们将创建一个嵌入了这个视频的PHP页面,该页面代码如下:
simptest.php 复制内容到剪贴板 代码:
require "DB.php";
  
$moviebase = 'http://localhost:8080/movies/';
  
$dsn = 'mysql://root@localhost/movies';
$db =& DB::connect( $dsn );
if ( PEAR::isError( $db ) ) { die($db->getMessage()); }
  
$source = null;
$movieId = 1;
if ( array_key_exists( 'movie', $_GET ) )
  $movieId = $_GET['movie'];
  
$movies = array();
$res = $db->query( 'SELECT movieId, source, title FROM movies' );
while( $row = $res->fetchrow( ) ) {
  $movies []= $row;
  if ( $row[0] == $movieId )
    $source = $row[1];
}
  
if ( $source == null )
    $source = $movies[0][1];
?>




  height="335"
  codebase="http://fpdownload.macromedia.com/get/flashplayer/current/
swflash.cab">



  width="400" height="335" play="true"
  loop="false"
  quality="high"
  flashVars="movie="
  type="application/x-shockwave-flash"
  pluginspage="http://www.adobe.com/go/getflashplayer">



foreach( $movies as $movie ) {
?>


}
?>



在上面的代码中,一开始是连接到数据库并获取视频列表。然后它就开始查找是否有与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 复制内容到剪贴板 代码:
require "DB.php";
  
$moviebase = 'http://localhost:8080/movies/';
  
header( 'content-type: text/xml' );
  
$dsn = 'mysql://root@localhost/movies';
$db =& DB::connect( $dsn );
if ( PEAR::isError( $db ) ) { die($db->getMessage()); }
?>

$res = $db->query( 'SELECT title, source, thumb, width, height FROM movies' );
while( $row = $res->fetchrow( ) ) {
?>
      thumb="" width=""
   height="" />
}
?>

你可以通过命令行运行它然后查看生成的XML,也可以在浏览器中打开这个页面然后你就可以看到以树形方式显示的XML,见图3:


图3.视频的XML列表

有了这个XML列表,我们就可以创建一个扩展自simplemovie.mxml的Flex程序,代码如下:
mytube1.mxml 复制内容到剪贴板 代码:


  

  
<script> <br> import mx.rpc.events.ResultEvent; <br> import mx.controls.VideoDisplay; <br> import mx.controls.List; <br> import mx.rpc.http.HTTPService; <br> import mx.collections.ArrayCollection; <br>   <br> [Bindable] <br> private var movies : ArrayCollection = new ArrayCollection(); <br>   <br> public function onGetMovies( event : ResultEvent ) : void <br> { <br>   var firstMovie : String = event.result.movies.movie[0].source.toString(); <br>   videoPlayer.source = firstMovie; <br>   <br>   movies = event.result.movies.movie; <br>   movieList.selectedIndex = 0; <br> } <br>   <br> public function onPrevious() : void <br> { <br>   if ( movieList.selectedIndex == 0 ) <br>     movieList.selectedIndex = movies.length - 1; <br>   else <br>     movieList.selectedIndex -= 1; <br>   videoPlayer.source = this.movieList.selectedItem.source.toString(); <br> } <br>   <br> public function onPlay() : void <br> { <br>   videoPlayer.source = this.movieList.selectedItem.source.toString(); <br>   videoPlayer.play(); <br> } <br>   <br> public function onNext() : void <br> { <br>   if ( movieList.selectedIndex >= ( movies.length - 1 ) ) <br>     movieList.selectedIndex = 0; <br>   else <br>     movieList.selectedIndex += 1; <br>   videoPlayer.source = this.movieList.selectedItem.source.toString(); <br> } <br>   <br> public function onChange() : void <br> { <br>   videoPlayer.source = this.movieList.selectedItem.source.toString(); <br> } <br> </script>
  

  
   
   
      
      
      
   

   

          dataProvider="{movies}"
      change="onChange()"
      labelField="title">


明显的变化就是页面上半部分添加了很多ActionScript代码,它们用来管理界面。这些代码首先在onGetMovies()使用 HTTPService从movies.php中读取XML。当HTTPService类检测到XML时会立刻返回一个XML文档对象模型(DOM),然 后我们就可以使用这个DOM来读取第一个视频并播放它。函数onGetMovies()还设定了一个movies变量来存储列表框中要显示的视频。 ActionScript代码中的其它方法处理界面可能触发的不同事件,例如用户点击了视频列表、点击了“上一个”或“下一个”按钮等等。
最下面的代码是一些组成用户界面的Flex组件。其中有一些按钮??左箭头和右箭头??来切换到下一个或上一个视频。在VideoDisplay的右边有一个视频列表,在这里该列表只是列出了视频的名字。
使用Flex编译并运行程序,结果如图4:


图4.Flex用户界面的第一个版本

现在我们可以使用右边的列表来选择视频,或者通过按下左/右按钮在视频之间切换。这个程序已经相当不错了,不过我们的缩略图在哪里使用了呢?



Flex 界面,第二部分??添加了缩略图
要在列表中使用缩略图,你需要对列表做一下更改使其可以同时显示缩略图及其标题。幸运的是在Flex中实现这一点很容易。首先我们要修改标签为其添加一个itemRenderer,代码如下:
mytube2.mxml 复制内容到剪贴板 代码:
...
       dataProvider="{movies}"
    change="onChange()"
    itemRenderer="MovieItem">
...
这个itemRenderer是一个由你自己创建的MXML组件,而且它的文件名必须是MovieItem。你可以通过选择菜单中的 New > MXML Component 来创建文件,然后将下面的代码添加进去:
MovieItem.mxml 复制内容到剪贴板 代码:


        height="{data.height/3}" rotation="5" left="10" top="0" />
   

我使用了Canvas容器,这样我就可以按照自己的想法定位其中的组件了,当然,你可以使用最适合你的布局的容器。然后,我使用了一 个标签用来加载图像并使用了一个
陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
超越炒作:評估當今PHP的角色超越炒作:評估當今PHP的角色Apr 12, 2025 am 12:17 AM

PHP在現代編程中仍然是一個強大且廣泛使用的工具,尤其在web開發領域。 1)PHP易用且與數據庫集成無縫,是許多開發者的首選。 2)它支持動態內容生成和麵向對象編程,適合快速創建和維護網站。 3)PHP的性能可以通過緩存和優化數據庫查詢來提升,其廣泛的社區和豐富生態系統使其在當今技術棧中仍具重要地位。

PHP中的弱參考是什麼?什麼時候有用?PHP中的弱參考是什麼?什麼時候有用?Apr 12, 2025 am 12:13 AM

在PHP中,弱引用是通過WeakReference類實現的,不會阻止垃圾回收器回收對象。弱引用適用於緩存系統和事件監聽器等場景,需注意其不能保證對象存活,且垃圾回收可能延遲。

解釋PHP中的__ Invoke Magic方法。解釋PHP中的__ Invoke Magic方法。Apr 12, 2025 am 12:07 AM

\_\_invoke方法允許對象像函數一樣被調用。 1.定義\_\_invoke方法使對象可被調用。 2.使用$obj(...)語法時,PHP會執行\_\_invoke方法。 3.適用於日誌記錄和計算器等場景,提高代碼靈活性和可讀性。

解釋PHP 8.1中的纖維以進行並發。解釋PHP 8.1中的纖維以進行並發。Apr 12, 2025 am 12:05 AM

Fibers在PHP8.1中引入,提升了並發處理能力。 1)Fibers是一種輕量級的並發模型,類似於協程。 2)它們允許開發者手動控制任務的執行流,適合處理I/O密集型任務。 3)使用Fibers可以編寫更高效、響應性更強的代碼。

PHP社區:資源,支持和發展PHP社區:資源,支持和發展Apr 12, 2025 am 12:04 AM

PHP社區提供了豐富的資源和支持,幫助開發者成長。 1)資源包括官方文檔、教程、博客和開源項目如Laravel和Symfony。 2)支持可以通過StackOverflow、Reddit和Slack頻道獲得。 3)開發動態可以通過關注RFC了解。 4)融入社區可以通過積極參與、貢獻代碼和學習分享來實現。

PHP與Python:了解差異PHP與Python:了解差異Apr 11, 2025 am 12:15 AM

PHP和Python各有優勢,選擇應基於項目需求。 1.PHP適合web開發,語法簡單,執行效率高。 2.Python適用於數據科學和機器學習,語法簡潔,庫豐富。

php:死亡還是簡單地適應?php:死亡還是簡單地適應?Apr 11, 2025 am 12:13 AM

PHP不是在消亡,而是在不斷適應和進化。 1)PHP從1994年起經歷多次版本迭代,適應新技術趨勢。 2)目前廣泛應用於電子商務、內容管理系統等領域。 3)PHP8引入JIT編譯器等功能,提升性能和現代化。 4)使用OPcache和遵循PSR-12標準可優化性能和代碼質量。

PHP的未來:改編和創新PHP的未來:改編和創新Apr 11, 2025 am 12:01 AM

PHP的未來將通過適應新技術趨勢和引入創新特性來實現:1)適應云計算、容器化和微服務架構,支持Docker和Kubernetes;2)引入JIT編譯器和枚舉類型,提升性能和數據處理效率;3)持續優化性能和推廣最佳實踐。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
3 週前By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解鎖Myrise中的所有內容
4 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序,非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具,幫助Web開發人員更好地理解保護網路應用程式的過程,並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞,難度各不相同。請注意,該軟體中

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

SublimeText3 英文版

SublimeText3 英文版

推薦:為Win版本,支援程式碼提示!

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境