【智能路由器】系列文章连接
http://blog.csdn.net/u012819339/article/category/5803489
在路由器上架设一个轻量级的web服务器,一方面管理员可以通过访问该服务器来设置路由器,另一方面,普通用户可以通过该服务器浏览路由器中存储的网页,视频,音乐等资源(路由器上需挂接移动硬盘)。
以下摘录百度百科对lighttpd的一段简介:
Lighttpd 是一个德国人领导的开源Web服务器软件,其根本的目的是提供一个专门针对高性能网站,安全、快速、兼容性好并且灵活的web server环境。具有非常低的内存开销、cpu占用率低、效能好以及丰富的模块等特点。
Lighttpd是众多OpenSource轻量级的web server中较为优秀的一个。支持FastCGI,CGI,Auth,输出压缩(output compress),URL重写,Alias等重要功能;而Apache之所以流行,很大程度也是因为功能丰富,在lighttpd上很多功能都有相应的实现了,这点对于apache的用户是非常重要的,因为迁移到lighttpd就必须面对这些问题。
当然还是lihgttpd官网说明比较详细,同时也提供源码下载,网址http://www.lighttpd.net/,有兴趣的同学可以去了解
路由器上的web资源有两个部分:一部分是用来设置路由器的,这部分资源应该设置访问权限保护起来,以供管理员使用。另一部分就是供路由器子网下的设备访问使用,这部分资源供普通用户影音娱乐,下载,交流使用(往往这部分资源比较大,需要在路由器上挂接硬盘)。
进入/lighttpd-1.4.20/,打开文件 lighttpd.conf,在 serve.modules 中将,mod_ssi,mod_access,mod_auth,mod_cgi,前面的注释去掉,如下:
添加服务器下特定目录访问权限,279 行auth.require 改成如下形式
auth.require = (
"/settings/" =>
(
"method" => "basic",
"realm" => "Router setting WebSite",
"require" => "valid-user"
)
)
解释一下,对 web 服务器根目录下 settings 目录设置访问认证,所有用户都需认证,Router setting Website 是当访问受限目录 settings 时弹出的认证框的内容。
将lighttpd-1.4.20 下 www 目录中所有的文件及子目录全部剪切,并在该目录下建立 settings 目录,然后将剪切的内容粘贴到 settings 下,在www 目录下建立 avres 和 mycgibin
文件夹。写个路由器登录默认网页 index.html,目的作为跳转,简单范例:
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>welcome!</title>
<style> </style>
</head>
<body>
<h1 align="center" ><a href="settings/index.html" >Go to router setting! ---></a></h1>
<br />
<h1 align="center"><a href="avres/mycgibin/videohome.cgi" >Go to video home!---></a></h1>
</body>
</html>
浏览器输入路由器IP 的时候,默认访问此网页,点击Go to router setting! —>链接后会进入路由器设置网页,此时服务器要求输入用户名和密码。点击Go to video home! —>链接的时候直接调用 mycgibin 中的脚本,该脚本搜索 avres 目录及其子目录下的所有 .mp4 文件,并生成网页返回给客户端。(注:avres 是U 盘挂载目录)。
路由器中视频资源播放网页编写。第一种,利用html5的video标签(可以识别.mp4、.Ogg、.WebM文件)特性,关键代码如下:
<video src="a.mp4" width="640" height="480" controls="controls">
your brower dose not support the video tag
</video>
第二种,利用插件(可以识别.Flv、.swf文件)播放,关键代码:
<object class width="300" height="240">
<param name="movie" value="flvplayer.swf">
<param name="quality" value="high">
<param name="allowFullScreen" value="true">
<param name="FlashVars" value="vcastr_file=images/1234.flv&BufferTime=3&IsAutoPlay=1">
<embed src="flvplayer.swf" allowfullscreen="true" flashvars="vcastr_file=images/1234.flv&IsAutoPlay=1" quality="high" width="300" height="240"></embed>
</object>
以上两种代码都可以。
在 Lighttpd 服务器根目录改动 中我写过一个简单的路由器登录跳转网页,如下
<h1 align="center" ><a href="settings/index.html" >Go to router setting! ---></a></h1>
<h1 align="center"><a href="avres/mycgibin/videohome.cgi" >Go to video home!---></a></h1>
其中videohome.cgi是用户点击Go to video home!后lighttpd所调用的cgi程序,其实这是一个脚本文件,该文件查询web 服务器整个根目录下所有.mp4 文件,并返回网页数据。核心代码如下:
find ../ -name "*.mp4" | sed -e 's/^/<li><a title=\"/g' -e 's/\(^.*$\)/\1@@\1/g' -e
's/@@.*\/\+/\">/g' -e 's/$/<\/a><\/li>/g'
/* 还是很担心这串命令有些人看不懂啊,其实就是 搜索和替换 的过程,find命令和sed命令的运用。 例如,在web服务器根目录下有个MP4文件路径为 /video/aa3/bb4/hungergames3.mp4 则进过一下代码后会形成字符串 <li><a title="/video/aa3/bb4/hungergames3.mp4">hungergames3.mp4</a></li> */
该文件放在web 服务器mycgibin 目录下。测试网页通过javascript 获取对应无序列表中子节点a属性下title 内容就可知道视频资源的相对位置。
挂载u 盘到/etc_ro/lighttpd/www/avres/下,浏览器输入路由器IP 即可看到以下内容
点击 Go to router setting!—>会弹出登陆框,如下
点击Go to video home!—>则会显示如下界面(事先U盘里已经存放了几部测试视频),该网页由videohome.cgi动态生成,
点击左边的文件即可播放视频:
是不是有那么一点家庭影院的味道? 如果路由器上挂载一个大容量的硬盘,再编写一些漂亮的网页界面放到路由器中,路由器在空闲时段自动下载高清电影存储在硬盘上,这样路由器子网下的设备几乎可以不受网速的限制而随时访问这些视频资源,是不是就可以打造一个小型的家庭影院呢?
videohome.cgi源码如下:
#! /bin/sh
#################
#author: arvik
#porpuse: Scan lighttpd web server root directory and extact all MP4 file
# path and filename, unordered list into a web page
#date:
#################
echo "<!DOCTYPE html>
<html>
<head>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=gb2312\" />
<title>router video</title>
<style> a:hover{cursor:pointer; font-size:16px; font-style:oblique;} li{margin-top:5px; background-color:#cccccc;} *{margin:0px; padding:0px;} </style>
<script language=\"javascript\" type=\"text/javascript\"> function getvideourl() { var ul = document.getElementById('videolist'); var lis = ul.getElementsByTagName('a'); for(var i=0; i<lis.length; i++) { lis[i].onclick = function() { var vurl = this.title; var vplay = document.getElementById('videoplayer'); vplay.src=vurl; for(var j=0; j<lis.length; j++) { lis[j].style.color =\"#000000\"; lis[j].parentNode.style.backgroundColor=\"#cccccc\"; } this.style.color=\"#ffffff\"; this.parentNode.style.backgroundColor=\"#333333\"; vplay.load(); vplay.play(); } } } </script>
</head>
<body bgcolor=\"#999966\" onload=\"getvideourl()\">
<div>
<div style=\"float:left; background-color:#666666; margin-left:20px; margin-top:30px; width:180px; height:530px; text-align:center;\">
<h2>video source</h2>
<ul id=\"videolist\" style=\"list-style:none; margin-left:0px\">"
find ../ -name "*.mp4" | sed -e 's/^/<li><a title=\"/g' -e 's/\(^.*$\)/\1@@\1/g' -e 's/@@.*\/\+/\">/g' -e 's/$/<\/a><\/li>/g'
echo "</ul>
</div>
<div align=\"center\" style=\"float:left; margin-left:50px; margin-top:30px;\">
<video id =\"videoplayer\" src=\"a.mp4\" width=\"880\" height=\"530\" controls=\"controls\">
Your brower dose not support the HTML5 video tag! Maybe you should updata your brower or switch to IE compatibility mode.
</video>
</div>
</div>
</body>
</html>"
好啦,本文到此结束,作者arvik,【智能路由器】系列文章见
http://blog.csdn.net/u012819339/article/category/5803489