本帖参考了:
linux中国社区,wxy兄的《搭建一个Flv视频播放服务器》的帖子,在此表示由衷的感谢。
原文链接:http://linux.cn/home/space-3-do-blog-id-136.html
基于OpenBSD的音视频服务器——LongTail
一 . 下载和简介
今天我们的主角出场了:JW Player 5
首先我们需要下载它,访问:http://www.longtailvideo.com,
会出现如下画面,点击左边的"Download Now"按钮
进入新的如下页面:
默认这两处是勾选的,到这一步,你可以先下载JW Player, 解压缩(unzip)后, 就可以获得该软件并运行在你的网站上。此处如果全部勾选下载的文件是mediaplayer-viral.zip,否则为mediaplayer.zip。
随便填写一个email地址,然后点击左下的"Download Now"按钮
此时下载过程应该已经开始了,如果你使用IE,上面可能会出现一个浅黄色提示条——“为了保护您的安全,Internet Explorer 已经阻止从此站点下载文件到您的计算机......”,此时右键点击浅黄色提示条,然后从菜单中选择“下载文件”即可。
或在下面的新页面内点击文字所示的链接:
这里显示了三个安装选项:
1.使用AdSoulution建立播放器
2.使用安装指南
3.使用安装向导
我们分别展开说一下:
点击第一个选项后,出现如下页面,这里注意一下,下图中的黑色矩形原来是有图像的,因为是flash,我的截图软件抓不到信息,所以成了全黑屏,嫌难看,放了个浅浅的本站广告,不好意思。
这里主要是说:
第一个选项是用AdSoulution建立播放器,LongTail AdSolution,网页上声称它是一个完全的自服务系统,你完全可以根据自己的需要在自己的网站内嵌入任何网络上的广告标签.
你只需进入该选项后点击上面的sign up链接,然后登录到开发者的Dashboard后运行pre-roll,overlay mid-roll和post-roll广告,整个过程仅几分钟时间。
基于OpenBSD的音视频服务器——LongTail video
第二个选项是使用安装指南:
点击后出现如下画面:
大致意思是教你怎样在页面里安装jwplayer:
第一步:
将player.swf, yt.swf and swfobject.js这三个文件传到你的服务器上,并确保你已经将所有的videos或songs或images传到了服务器上。
第二步:
用下面的代码将播放器嵌入到你的html网页上,注意:如果你修改了默认的目录,需要在code里做相应的修改。上面的flashvars参数可包含为播放器配置不同插件和皮肤的一个变量列表,要快速建立flashvaes请使用第三个选项“安装向导”。
如果要使用则粘贴code到页面代码中。
第三个选项是使用安装向导:
你可以用里面的下拉菜单。
如下图:
别大意,注意图中右边的说明:
读者随意了,我只能用选项二或三了。
点击后出现如下画面:
大致意思是教你怎样在页面里安装jwplayer:
第一步:
将player.swf, yt.swf and swfobject.js这三个文件传到你的服务器上,并确保你已经将所有的videos或songs或images传到了服务器上。
第二步:
用下面的代码将播放器嵌入到你的html网页上,注意:如果你修改了默认的目录,需要在code里做相应的修改。
代码: 全选
<p id='preview'>The player will show in this paragraph</p>
<script type='text/javascript' src='swfobject.js'></script>
<script type='text/javascript'>
var s1 = new SWFObject('player.swf','player','400','300','9');
s1.addParam('allowfullscreen','true');
s1.addParam('allowscriptaccess','always');
s1.addParam('flashvars','file=video.flv');
s1.write('preview');
</script>
如果要使用则粘贴code到页面代码中。
第三个选项是使用安装向导:
你可以用里面的下拉菜单。
如下图:
别大意,注意图中右边的说明:
好的,三个安装方式我们介绍完了,你现在明白了吧,你可以播放广告,但是如果要播自己的广告,则只能买许可证,否则只能采用选项一的方式,由longtail替你选择广告商(当然上面说了,你可能可以得到回报。)如果你没有买一个商业许可证,则不能在下列站点上使用JW Player:
(i) 一个有广告的站点上
(ii) 企业站点
(iii) CMS——也就是现在流行的社区首页,像163、sina,sohu的首页模式。
读者随意了,我只能用选项二或三了。
二 . 实战应用
我们根据安装指南进行设置,也就是进入实战应用的阶段:
如果你想开机就启动apache,请编辑 /etc/rc.conf.local,添加如下内容:
如果你不想重新启动计算机就启动apache,这样:
我们保留原始的htdocs目录,只将其改名:
在新建一个实验目录:
把下载的文件,解压缩后上传到新建的 /var/www/htdocs 目录里:
总共有6个文件,其中player-viral.swf实际上就是播放器,preview.jpg就是flv文件的预览图片,readme.html是说明文件,那么这个swfobject.js是什么呢?就是原来的FlashObject,由于法律原因已经更名为SWFObject,详这里,中文的简介看这里,很详细了;用vi查看一下版本信息:
目前swfobject的网站的版本已经是SWFObject 2.2了,发布在http://code.google.com/p/swfobject/ ,考虑到文章的实效性,请自行上网站上查询并根据自己的情况取舍吧,这里只是介绍方法,本例中仅以longtail提供的1.5版本做视频测试,如果你有兴趣尝试一下新版本那也未尝不可。video.flv是播放的视频文件,yt.swf也是包含了youtube图标的播放文件。
因为我们下载的是“mediaplayer-viral.zip”,而选项二的例子中的代码是以mediaplayer.zip为蓝本的,所以,我们要对代码做一些调整:
源代码:将其中的player.swf 更换为player-viral.swf
注意上面这段代码,video.flv就是要播放的视频,preview应该是视频预览图片,读者可以自行更换这两个文件或修改这里的代码,实际上,你在浏览器里输入:
http://你的web服务器地址/readme.html,就已经可以看见官方的说明以及视频实例了。
我这里偷懒一下,不去找flv了,直接使用官方的flv和预览文件,我们来一个最简单的测试,重新建立一个test.html:
上传到服务器后根目录下(与刚才传的六个文件同目录),在浏览器窗口上输入:http://你的web服务器地址/test.html
就可以看见flash视频了,因为这个不是视频教程,我们这里仅放一张截图:
有关选项三的说明:
选项三里面可选择的东西很多,包含皮肤、插件、播放列表、布局等,甚至可以播放windows的视频、功能很多,但感觉与选项二大同小异,今后有时间再在这里展开讨论了。
另外,关于怎样制作flv的问题,请大家自行google吧,如果您有好的方法也请拿出来分享。
我们根据安装指南进行设置,也就是进入实战应用的阶段:
如果你想开机就启动apache,请编辑 /etc/rc.conf.local,添加如下内容:
代码: 全选
httpd_flags=""
代码: 全选
# /usr/sbin/httpd start
代码: 全选
# cd /var/www/
# mv htdocs htdocs.old
代码: 全选
# mkdir htdocs
代码: 全选
# cd /var/www/htdocs
# ls -la
total 704
drwxr-xr-x 2 root daemon 512 Dec 22 04:05 .
drwxr-xr-x 11 root daemon 512 Dec 22 04:04 ..
-rw-r--r-- 1 root daemon 82807 Dec 22 04:05 player-viral.swf
-rw-r--r-- 1 root daemon 8295 Dec 22 04:05 preview.jpg
-rw-r--r-- 1 root daemon 5847 Dec 22 04:05 readme.html
-rw-r--r-- 1 root daemon 6887 Dec 22 04:05 swfobject.js
-rw-r--r-- 1 root daemon 216278 Dec 22 04:05 video.flv
-rw-r--r-- 1 root daemon 1101 Dec 22 04:05 yt.swf
#
SWFObject v1.5: Flash Player detection and embed - http://blog.deconcept.com/swfobject/
目前swfobject的网站的版本已经是SWFObject 2.2了,发布在http://code.google.com/p/swfobject/ ,考虑到文章的实效性,请自行上网站上查询并根据自己的情况取舍吧,这里只是介绍方法,本例中仅以longtail提供的1.5版本做视频测试,如果你有兴趣尝试一下新版本那也未尝不可。video.flv是播放的视频文件,yt.swf也是包含了youtube图标的播放文件。
因为我们下载的是“mediaplayer-viral.zip”,而选项二的例子中的代码是以mediaplayer.zip为蓝本的,所以,我们要对代码做一些调整:
源代码:
代码: 全选
<p id='preview'>The player will show in this paragraph</p>
<script type='text/javascript' src='swfobject.js'></script>
<script type='text/javascript'>
var s1 = new SWFObject([color=royalblue]'player.swf'[/color],'player','400','300','9');
s1.addParam('allowfullscreen','true');
s1.addParam('allowscriptaccess','always');
s1.addParam('flashvars','file=video.flv');
s1.write('preview');
</script>
代码: 全选
<p id='preview'>The player will show in this paragraph</p>
<script type='text/javascript' src='swfobject.js'></script>
<script type='text/javascript'>
var s1 = new SWFObject([color=royalblue]'player-viral.swf'[/color],'player','400','300','9');
s1.addParam('allowfullscreen','true');
s1.addParam('allowscriptaccess','always');
s1.addParam('flashvars','file=video.flv');
s1.write('preview');
</script>
http://你的web服务器地址/readme.html,就已经可以看见官方的说明以及视频实例了。
我这里偷懒一下,不去找flv了,直接使用官方的flv和预览文件,我们来一个最简单的测试,重新建立一个test.html:
代码: 全选
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>我们来一个最简单的测试</title>
</head>
<body>
<p id='preview'>The player will show in this paragraph</p>
<script type='text/javascript' src='swfobject.js'></script>
<script type='text/javascript'>
var s1 = new SWFObject('player-viral.swf','player','400','300','9');
s1.addParam('allowfullscreen','true');
s1.addParam('allowscriptaccess','always');
s1.addParam('flashvars','file=video.flv');
s1.write('preview');
</script>
</body>
</html>
就可以看见flash视频了,因为这个不是视频教程,我们这里仅放一张截图:
有关选项三的说明:
选项三里面可选择的东西很多,包含皮肤、插件、播放列表、布局等,甚至可以播放windows的视频、功能很多,但感觉与选项二大同小异,今后有时间再在这里展开讨论了。
另外,关于怎样制作flv的问题,请大家自行google吧,如果您有好的方法也请拿出来分享。
在线用户
正浏览此版面之用户: 没有注册用户 和 0 访客