本帖最后由 tll 于 2013-5-11 18:46 编辑
先炫一下:http://110.80.100.114:81/(随时可能关闭啊)
大家都知道,MJ(mjpg-streamer)自带web服务器,但是大家都知道,那东西不能跑PHP什么的,甚不方便
于是,我打算用apache当我的webserver~
我写了个用php获取MJ视频流再输出到apache。
记得安装curl的php扩展啊
以下是代码:- <?php
- $ch = curl_init();
- curl_setopt($ch, CURLOPT_URL,
- "127.0.0.1/?action=snapshot");
- curl_setopt($ch,
- CURLOPT_RETURNTRANSFER, 1);
- $output = curl_exec($ch);
- curl_close($ch);
- $file_size=count($output);
- Header("Content-type: image/jpeg");
- Header("Accept-Ranges: bytes");
- Header("Accept-Length:".$file_size);
- echo $output;
- ?>
复制代码 然后,保存为getfile.php,到根目录,再把apache的端口调成81,重启
打开MJ,端口设置为80(因为我没映射所以MJ的80端口外网是访问不到的)
再写个index.html:
- Hello~
- FROM PHP - MJPG-STREAMER
- <!--<img src="getfile.php" />-->
- <script type="text/javascript">
- var imageNr = 0; // Serial number of current image
- var finished = new Array();
- var paused = false;
- function createImageLayer() {
- var img = new Image();
- img.style.position = "absolute";
- img.style.zIndex = -1;
- img.onload = imageOnload;
- img.onclick = imageOnclick;
- img.src = "getfile.php?id=" + (++imageNr);
- var webcam = document.getElementById("webcam");
- webcam.insertBefore(img, webcam.firstChild);
- }
- function imageOnload() {
- this.style.zIndex = imageNr; // Image finished, bring to front!
- while (1 < finished.length) {
-
- var del = finished.shift(); // Delete old image(s) from docuent
- del.parentNode.removeChild(del);
- }
- finished.push(this);
- if (!paused) createImageLayer();
- }
- function imageOnclick() { // Clicking on the image will pause the stream
- paused = !paused;
- if (!paused) createImageLayer();
- }
- </script>
- <body onload="createImageLayer();">
- <div id="webcam"></div>
复制代码 好了,访问一下 http://你的ip:81,看看是不是有这个效果吧(会动的)
效果:
|