VLC播放RTSP視訊流(360瀏覽器可用)

阿新 • • 發佈：2019-01-16

<!--<!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" >  -->
<!DOCTYPE >
<head>   
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
<link rel="stylesheet" href="css/demo.css" />
<link rel="stylesheet" href="css/easyui.css" />
<link rel="stylesheet" href="css/icon.css" />
<script src="js/jquery.min.js"></script>
<script src="js/jquery.easyui.min.js"></script>
<script>   
var itemId = 0;  
var url = "";
var totalTime = "";
var playTime;
var ss=0;
var sMin=0;
var sH=0;
var millisec=0;
var tottime = 0;
var iTime;
function registerVLCEvent(event, handler) {
    var vlc = getVLC("vlc");
    if (vlc) {
        if (vlc.attachEvent) {
            // Microsoft
            vlc.attachEvent (event, handler);
        } else if (vlc.addEventListener) {
            // Mozilla: DOM level 2
            vlc.addEventListener (event, handler, false);
        }
    }
}
function unregisterVLCEvent(event, handler) {
    var vlc = getVLC("vlc");
    if (vlc) {
        if (vlc.detachEvent) {
            // Microsoft
            vlc.detachEvent (event, handler);
        } else if (vlc.removeEventListener) {
            // Mozilla: DOM level 2
            vlc.removeEventListener (event, handler, false);
        }
    }
}
function getVLC(name)   
{   
        if (window.document[name])      
        {   
                return window.document[name];   
        }   
        if (navigator.appName.indexOf("Microsoft Internet")==-1)   
        {   
                if (document.embeds && document.embeds[name])   
                        return document.embeds[name];      
        }   
        else   
        {   
                return document.getElementById(name);   
        }   
}   
function showTime(){
	 var vlc = getVLC("vlc"); 

	 setTimeout(setTime,1000);
	 function setTime(){
	 	console.log(vlc.input.length);	
	 millisec = vlc.input.length;
	 var h = Math.floor(millisec/1000/60/60);
	 var min = Math.floor(millisec/1000/60);
	 var s = Math.floor(millisec/1000)-min*60;
	 if(h<=0)
	 {
	 	h = "00";
	 }else if(h>0&&h<10){
	 	h = "0"+h;
	 }
	  if(min<=0)
	 {
	 	min = "00";
	 }else if(min>0&&min<10){
	 	min = "0"+min;
	 }
	  if(s<=0)
	 {
	 	s = "00";
	 }else if(s>0&&s<10){
	 	s = "0"+s;
	 }
	 totalTime = h+":"+min+":"+s;
	 console.log(totalTime);
	 $("#totaltime").empty();
	 $("#totaltime").append("總時長: "+totalTime);	 	
		}
	 iTime=setInterval(playTime,1000);
	 function playTime(){
	 
	 	if(ss<60){
	 		ss++;
	 		if(ss<10){
	 			ss="0"+ss;
	 		}	 		
	 	}else{
	 		sMin++;
	 		ss=0;
	 		if(sMin<10){
	 			sMin= "0"+sMin;
	 		}
	 		if(sMin>=60){
	 			sMin = 0;
	 			sH++;
	 			if(sH<10){
	 				sH = "0"+sH;
	 			}
	 			if(sH>=24){
	 				sH=0;
	 			}
	 		}
	 	}
	 playTime = sH+":"+sMin+":"+ss;
	 tottime = parseInt(sH)*60*60+ parseInt(sMin)*60+parseInt(ss);
	  if(tottime>=Math.floor(millisec/1000))
	 {
//	 	alert("===");
	 	clearInterval(iTime);
	 }
	 $("#palyTime").empty();
	 $("#palyTime").append(playTime);		
	 console.log(tottime );	
	 }
	
	}
function doGo(mrl)   
{   	
//		alert(mrl);
		ss=0;
        sMin=0;
        sH=0;
		$("#palyTime").empty();
	 	$("#palyTime").append("--:--:--");
        var vlc = getVLC("vlc");   
        itemId=vlc.playlist.add(mrl); 
        vlc.playlist.playItem(itemId);   
        document.getElementById("btn_stop").disabled = false;   
}   
  
function updateVolume(deltaVol)   
{   
        var vlc = getVLC("vlc");   
        vlc.audio.volume += deltaVol;   
}   
function doPlay()   
{   
//		alert(itemId);
		var vlc = getVLC("vlc"); 
		vlc.playlist.play();
//		unregisterVLCEvent("MediaPlayerPlaying",handle_MediaPlayerPlaying);
//		showTime();
        document.getElementById("btn_stop").disabled = false;   
        document.getElementById("btn_play").disabled = true;   
}   
function handle_MediaPlayerPaused(){
//  alert("Paused");
    clearInterval(iTime);
} 
function handle_MediaPlayerPlaying(){

//  alert("Playing");
    showTime();
}
function doStop()   
{   
        clearInterval(iTime);
        ss=0;
        sMin=0;
        sH=0;
         $("#palyTime").empty();
	 $("#palyTime").append("--:--:--");	
        getVLC("vlc").playlist.stop();
        document.getElementById("btn_stop").disabled = true;   
        document.getElementById("btn_play").disabled = false;   
}   
function getTime(){
	var st=document.getElementById("startTime");
	var et=document.getElementById("endTime");
	var stValue = $("#starttime").datetimebox("getValue");
	var etValue = $("#endtime").datetimebox("getValue");

//	alert(stValue);
//	alert(etValue);
	var stYear = stValue.substr(6,4);
	var stMonth = stValue.substr(0,2);
	var stDay = stValue.substr(3,2);
	var stH = stValue.substr(11,2);
	var stMin = stValue.substr(14,2);
	var stS =stValue.substr(17,2);
	var stTime = stYear+"_"+stMonth+"_"+stDay+"_"+stH+"_"+stMin+"_"+stS;
//	alert(stTime);
	var etYear = etValue.substr(6,4);
	var etMonth = etValue.substr(0,2);
	var etDay = etValue.substr(3,2);
	var etH = etValue.substr(11,2);
	var etMin = etValue.substr(14,2);
	var etS =etValue.substr(17,2);
	var etTime = etYear+"_"+etMonth+"_"+etDay+"_"+etH+"_"+etMin+"_"+etS;
//	alert(etTime);	
	url = "rtsp://666666: 
[email protected]:554/cam/playback?channel=1&subtype=0"+"&starttime="+stTime+"&endtime="+etTime;
	alert(url);
	doGo(url);
}
window.onload=function(){
	// Register a bunch of callbacks.
	registerVLCEvent("MediaPlayerPaused", handle_MediaPlayerPaused);
	registerVLCEvent("MediaPlayerPlaying",handle_MediaPlayerPlaying);
}
</script>   
</head>   
<body>   
<div style="margin: 50px">   
        <!--<a title="rtsp://666666: 
[email protected]:554/cam/playback?channel=1&subtype=0" href="#" onclick="tip();return false;">貴州視訊rtsp流</a>--> 
        <h2 align="center">貴州監控視訊</h2>
        <span style="margin: 20px;" />   
        <a title="rtsp://218.204.223.237:554/live/1/66251FC11353191F/e7ooqwcfbqjoo80j.sdp" href="#" onclick="doGo(this.title);return false;">測試視訊rtsp流</a> 
       <span style="margin: 20px;" /> 
         <a title="http://127.0.0.1:8020/VLC01/1.flv" href="#" onclick="doGo(this.title);return false;">本地flv視訊流</a>
        <span style="margin: 20px;" /> 
          <a title="rtsp://184.72.239.149/vod/mp4://BigBuckBunny_175k.mov" href="#" onclick="doGo(this.title);return false;">時長rtsp視訊流</a>
        <span style="margin: 20px;" /> 
          <a title="http://192.168.35.121:13160/hdfsdownload/video/movie/20160623/fffca7b2k100026885.ts" href="#" onclick="doGo(this.title);return false;">http協議ts視訊流</a>
        <span style="margin: 20px;" /> 
</div>   
<div align="center">   
    <OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921" id="vlc"  
    codebase="http://download.videolan.org/pub/videolan/vlc/0.8.6c/win32/axvlc.cab"  
       width="600" height="480" id="vlc" events="True">  
 <param name="MRL" value="" />  
 <param name="Src" value="" />   
   <param name="ShowDisplay" value="True" />  
 <param name="AutoLoop" value="False" />  
 <param name="AutoPlay" value="False" />  
 <param name="Time" value="True"/>  
 <EMBED pluginspage="http://www.videolan.org"  
       type="application/x-vlc-plugin"  
       version="VideoLAN.VLCPlugin.2"  
       width="600"  
       height="480"      
       text="Waiting for video"  
       name="vlc"  
       ></EMBED>  
 </OBJECT>   
</div> 

<div align="center">  
<span id="palyTime">--:--:--</span>      
<input style="cursor: pointer;" type=button id="btn_play" value=" 重播 " onClick='doPlay();' disabled="true">   
<input style="cursor: pointer;"type=button id="btn_stop" value="停止" onClick='doStop();' disabled="true">   
<input style="cursor: pointer;"type=button value="靜音切換" onclick='getVLC("vlc").audio.toggleMute();'>   
<input style="cursor: pointer;"type=button value="減小音量" onclick='updateVolume(-10)'>   
<input style="cursor: pointer;"type=button value="增加音量" onclick='updateVolume(+10)'> 
      <span id="totaltime">總時長： --:--:--</span>
</div> 
<div style="margin-left: 1020px; margin-top: -300px;">
	<span">開始時間：</span><input class="easyui-datetimebox" required style="width:150px;height: 25px;" id="starttime">
	<br/><br/><br/>
	<span>結束時間：</span><input class="easyui-datetimebox" required style="width:150px;height: 25px;" id="endtime">
</div>
	<br/><br/><br/><input style="margin-left: 1080px; width: 150px; cursor: pointer;" type="button"onclick="getTime()" value="查詢"/>
  
</body>   
</html>

VLC播放RTSP視訊流(360瀏覽器可用)

<!--<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

VLC 播放RTSP 抓包分析

vlc 播放rtsp 抓包分析VLC 播放RTSP視頻抓包記錄：vlc -vvv rtsp://172.16.66.22/nuc.sdpOPTIONS： OPTIONS rtsp://172.16.66.22/nuc.sdp RTSP/1.0 CSeq: 2 User-Agent: LibVLC/2.2

網頁播放rtsp視訊流

RTSP協議（1）是流媒體協議。（2）RTSP協議是共有協議，並有專門機構做維護。（3）RTSP協議一般傳輸的是 ts、mp4 格式的流。（4）RTSP傳輸一般需要 2-3 個通道，命令

使用VideoView播放rtsp視訊流

1.視訊播放控制 package com.example.rtspvideoview; import android.app.ProgressDialog; import android.content.Context; import android.media.Medi

瀏覽器安裝vlc外掛播放rtsp流

網上很多例子都不管用了，今天自己參照寫了一個，經測試通過。注意的是，安裝vlc的時候記得勾選ie外掛、火狐外掛。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www

瀏覽器播放rtsp流媒體解決方案

wid 格式 script mar max-width main view pro tmp 老板提了一個需求，想讓網頁上播放景區監控的畫面，估計是想讓遊客達到未臨其地，已知其境的狀態吧。說這個之前，還是先說一下什麽是rtsp協議吧。 RTSP（Real Time S

Vlc支持IE 360 低版本的Google瀏覽器

height lan .get ram () span bject ont tr1 VLC 插件代碼： <object type=‘application/x-vlc-plugin‘ pluginspage="http://www.videolan.org/" i

跨瀏覽器網頁播放RTSP技術研究-未完待續

目標：希望Web瀏覽器能播放RTSP流，最好跨瀏覽器，最低要求是支援IE。簡單調查結論：外掛技術真的是飽受排斥！無外掛技術只支援新的瀏覽器，且資料相對少！暫時找不到一個跨平臺，穩定，效能好，且資料多的瀏覽器技術！ IE的Activex在安防行業

ie 嵌入 vlc 播放器外掛播放rtsp直播視訊

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www

瀏覽器低延時播放監控攝像頭視訊（EasyNVR播放FLV視訊流）

背景描述 EasyNVR的使用者應該都是清楚的瞭解到，EasyNVR一個強大的功能就是可以進行全平臺的無外掛直播。主要原因在於rtsp協議的視訊流（預設是需要外掛才可以播放的）經由EasyNVR處理可以滿足無外掛的全平臺直播。經由EasyNVR處理會獲取到RTMP、H

海康IPC+NVR+EasyDarwin+EasyPusher+VLC實現Web實時播放RTSP視訊

上篇部落格是用ffmpeg+nginx實現web播放rtsp視訊，原理是將rtsp轉碼成rtmp格式，再用flash外掛播放由於專案硬體條件有限，轉碼基本就不考慮了，因此只能直接播放獲取到的rtsp流，並且整個網路環境只能有一個外網IP，因此思路就是能否通過NVR去找同一網段內的IPC，如何搭建NVR和I

Android使用VideoView播放live555服務端的RTSP視訊流demo

簡介本文為一個簡單demo，測試live555作為RTSP的服務端，使用android自帶的VideoView播放RTSP視訊流。客戶端核心程式碼 private void playRtspStream(String rtspUr

ffmpeg推送,EasyDarwin轉發,vlc播放實現整個RTSP直播

部署EasyDarwin流媒體伺服器 ffmpeg推送攝像機視訊到EasyDarwin VLC播放第一步：部署EasyDarwin流媒體伺服器例如，我們現在將EasyDarwin流媒體伺服器部署在127.0.0.1，埠：554 第二

在海思hi3516C上面做流媒體rtsp server，總是存在延時很大並且VLC播放丟幀

丟幀是VLC報出來的，如下：我將幀率設定為15，而且是CIF解析度，區域網傳輸，不應該有丟幀啊！？我XX 查了一整天，各種辦法，最後我發現是海思SDK送出來PTS有問題： pts=pstStream->pstPack[i].u64PTS*90/100

android錄屏直播：VLC通過rtsp協議播放android錄屏實時視訊（Java實現）

首先說下為什麼要做這樣一個東西在上家公司的時候，作為客戶端開發，一個月要給領導演示異常app的開發成果，當時用的策略是用錄屏類軟體，錄製成mp4，然後通過投影播放mp4檔案，來給領導看。這樣做帶來的問題是，要提前準備mp4需要時間，領導想要看除了mp4外的

利用ffmpeg獲取rtsp視訊流並使用opencv播放

/*opencv庫*/ #include <opencv2\opencv.hpp> #include <iostream> extern "C" /*這裡必須要使用C方式匯入*/ { #include "libavcodec/avcodec.h"

利用vlc外掛將IP攝像頭嵌入網頁和網頁播放RTSP流

1. 描述　最近有一個專案需要將IP攝像機的畫面嵌入到web網頁中，考慮到減少開發成本，使用vlc外掛播放攝像頭提供的RTSP流。在videolan wiki的官網詳細介紹了關於vlc web plugin的使用方法。　有一點需要注意的是，vlc2

VLC播放攝像頭或者網路攝像頭通過rtsp流讀取視訊

#include <stdio.h> #include <stdint.h> #include <math.h> #include <stdlib.h> #include <assert.h>

RTSP視訊流的遠端播放的實現

無心學習，把最近這段時間的所想所思寄託在這片土地上，算是對自己的一個交代，也是對各位大大們的一種感激。原料：（1）海康威視攝像頭一個（2）PC機一臺（3）阿里ip一個實現的原理：（1）ffmpeg的轉碼（2）傳送到ffserver伺服器等待監聽，（3）轉發

RtspViewer可設定播放地址基於vlc播放採集rtsp地址視訊演示2.0 測試成功

20170122修改可以設定播放地址測試地址：rtsp://111.9.177.194:9090/dss/monitor/param?cameraid=1000063%240&substream=1 測試結果如下橫屏

VLC播放RTSP視訊流(360瀏覽器可用)

相關推薦