1. 程式人生 > >網頁嵌入快播播放器並實現伺服器視訊檔案連續播放

網頁嵌入快播播放器並實現伺服器視訊檔案連續播放

上篇我們在網頁中(html、jsp、php)嵌入了快播播放器,嵌入程式碼如下:

	<object classid="clsid:F3D0D36F-23F8-4682-A195-74C92B03D4AF" width="560" height="420" id="QvodPlayer" name="QvodPlayer" onError="downLoadQvod();">  
				 <param name="url" id="qvodurl0" value="http://192.168.1.254:8089/ftp/ftpupload//2_1001_025201.AVI">
				 <param name="Autoplay" value="1">   
				 <param name="Showcontrol" value="1">  
	</object>  


引數介紹:url:播放視訊檔案的地址  Autoplay:是否自動播放,1:是,0:否  Showcontrol:是否顯示控制欄,也就是下面的聲音控制以及進度條 1:是,0:否,介面如下:注意:下載的快播版本不同會有不同的頁面效果

在專案中我們可能會有這樣的需求,就是從伺服器端獲取很多的視訊檔案地址,我們播放一個後自動跳轉到下一個,開始我也是從快播方面考慮,在其論壇上http://bbs.kuaibo.com/找了很多相關方面的資料,發現其有自己的內部實現方式,可能要在其後臺進行相應的釋出和地址格式轉換等等,想要研究的看這篇部落格:http://bbs.kuaibo.com/thread-19410-1-1.html

,後來想來想去,還是自己用js解決了,在裡面使用了我們的定時器。程式碼如下:

<script type="text/javascript">
		 function downLoadQvod(){
		    if(window.confirm('請您先安裝QvodPlayer軟體,然後重新整理本頁才可以正常播放!')){
				window.open('<%=basePath%>video/qvod-setup.exe');
			  }
		 }

		 function play(){
		   QvodPlayer.url="F:/30230201/02-53-02.AVI";
                QvodPlayer.play();
		 }
         
		 var i=0;
		 function getState(){
		 //將請求的地址封裝為陣列
		  var   urlArray=["F:/30230201/02-52-01.AVI","F:/30230201/02-53-02.AVI","F:/30230201/02-53-03.AVI"];
		  var state = QvodPlayer.PlayState;
		   if(state==0&&i<urlArray.length){
		      QvodPlayer.url=urlArray[i];
			  QvodPlayer.play();
			  i++;
		   }
		 }
         
		 //設定定時器,1s種請求一次
		 setInterval("getState()",1000);
	</script>

我們也可以點選按鈕後出發定時器:

	 //單個視訊播放
		 function singlePlay(path){
			QvodPlayer.url="${video_path}"+path;
			QvodPlayer.play();
		 }
		 
		 //多個視訊連續播放
		 function multiPlay(index){
			 var urls=$("#s_"+index).text();
			 var i=1;
			 if(urls!=""){
				 var urlArray=urls.split(",");
				 singlePlay(urlArray[0]);
				 setInterval(function(){
					 var state = QvodPlayer.PlayState;
					  if(state==0&&i<urlArray.length-1){
						  singlePlay(urlArray[i]);
						  i++;
					   }
				 },1000);
			 }
		 }


這樣,每1s中就是判斷上一個視訊檔案是否播放完畢,播放完後自動跳轉到下一集,不足的是沒有做到像快播那樣自動緩衝下一集的功能,只是一個檔案的跳轉而已!!

上面我們可以看到快播裡面一個方法:QvodPlayer.PlayState;它是呼叫了快播中的一個屬性,快播給我們的js和vb提供了相應的介面,正是因為這些介面的存在,我們才可以在頁面中可以對快播玩轉自如,下面把它提供的介面給大家瞧瞧:

1、屬性介面:
1)URL:播放檔案地址。URL值格式:qvod://檔案大小|檔案hash值|檔名|
如:qvod://145485901|E4284D21B54DCB7181EA853B88746D693ACEA079|美麗的選擇-第三部-05.rmvb|
2) AutoPlay:是否自動播放。0:不自動播放  1:自動播放。預設是不自動播放。
< PARAM NAME='AutoPlay'  VALUE='0'>
3) Showcontrol:是否顯示控制欄,0=不顯示  1= 顯示 預設引數是顯示
< PARAM NAME='Showcontrol'  VALUE='0'>

4)NextWebPage:播放當前節目後自動導航到下一集或者其它網頁的功能
預設為空即不導航。網頁地址請以http://開頭.
<;PARAM NAME='NextWebPage' VALUE='http://www.vod588.com/dy_player/b22cbb3c.html?262614'>

5)NumLoop:是否迴圈播放當前節目
值:0 為不迴圈,大於0為迴圈次數,遞減到0後即停止迴圈,-1為一直迴圈。
預設為0.

6)QvodAdUrl: 網頁中的連結地址是qvod://格式時,可以在網頁中用此引數指定播放前的緩衝頁面地址
注:3.0.0.58版本及將來發布的版本才支援。
<PARAM NAME='QvodAdUrl' VALUE='http://buffer-ad.qvod.com/index_bak.asp'>

2、方法介面:
1)播放
Play():        
2)停止                        
Stop():        
3)暫停
Pause():                        

4)設定當前播放位置
Currentpos:         
例如想設定播放位置在一分鐘則:
c++等語言:
long newValue = 60;
put_Currentpos(newValue);
javastricpt/vb/vbstricpt等指令碼語言:
var pos = 60;
QvodPlayer.Currentpos = 60;

5) 得到當前播放位置
Currentpos:
c++等語言:               
double newValue = 0;
newValue  = get_Currentpos();
javastricpt/vb/vbstricpt等指令碼語言:
var pos = 0;
pos  = QvodPlayer.Currentpos;

6) 得到播放持續時間 
Duration:               
c++等語言:
double newValue = 0;
newValue  = get_Duration();
javastricpt/vb/vbstricpt等指令碼語言:
var pos = 0;
pos  = QvodPlayer.Duration;

7) 設定全屏與否 
Full (BOOL bFull):        
如設定全屏
c++等語言:
BOOL bFull = TRUE;//全屏則為TRUE,取消全屏則為FALSE
put_Full (bFull );
javastricpt/vb/vbstricpt等指令碼語言:
var pos = true;
QvodPlayer.Full= true;


8) 得到是否全屏 
Full:
c++等語言:
BOOL bFull = TRUE;
bFull  = get_Full ();
javastricpt/vb/vbstricpt等指令碼語言:
var pos = true;
pos  = QvodPlayer.Full;        

9) 設定靜音
Mute():
c++等語言:
BOOL bMute= TRUE;//靜單為TRUE,取消靜音則為FALSE;
put_Mute(bMute);
javastricpt/vb/vbstricpt等指令碼語言:
var pos = true;
QvodPlayer.Mute = pos ;        

10) 得到是否靜音狀態
BOOL GetMute():
c++等語言:
BOOL bMute = TRUE;
Mute  = get_Mute ();
javastricpt/vb/vbstricpt等指令碼語言:
var pos = true;
pos  = QvodPlayer.Mute;        
               
11) 得到當前播放狀態
PlayState():
c++等語言:
PLAYSTATE state= Undefined ;
state= get_PlayState ();
javastricpt/vb/vbstricpt等指令碼語言:
var state;
state = QvodPlayer.PlayState;

播放狀態值:        
enum enum_PalyState
{
_S_Init = 0,
_S_Stop,
_S_Pause,
_S_Playing,
_S_Buffering,
_S_Waiting,
_S_MediaEnded,
_S_Ready,
_S_Conning,
_S_BTDowning,
_S_CreateDS,
_S_Stoping
};//Undefined = 0,準備就緒 Stopped = 1,停止; Paused = 2,暫停; Playing = 3,播放中; Buffering = 4,緩衝中; Waiting = 5,等待中; MediaEnded = 6,播放結束Ready = 7, 準備讀;Reconnecting = 8,重連中; BTDowning = 9 BT種子下載中; Createing = 10,正在連線中; Stoping=11 正在停止;

剛開始播的時候的狀態是Createing
上面只是一部分,其他的就不一一例舉了,想去了解,點選這裡檢視更多:http://bbs.kuaibo.com/thread-592-1-1.html

相關推薦

網頁嵌入播放實現伺服器視訊檔案連續播放

上篇我們在網頁中(html、jsp、php)嵌入了快播播放器,嵌入程式碼如下: <object classid="clsid:F3D0D36F-23F8-4682-A195-74C92B03D4AF" width="560" height="420" id="Qvo

ffmpeg簡易播放實現-音視訊播放

基於FFmpeg和SDL實現的簡易視訊播放器,主要分為讀取視訊檔案解碼和呼叫SDL顯示兩大部分。 前面兩個實驗分別實現了視訊播放和音訊播放: FFmpeg簡易播放器的實現-視訊播放 FFmpeg簡易播放器的實現-音訊播放 本實驗將視訊播放和音訊播放結合在一起。 本實驗主要參考如下兩篇文章: [1]. 最簡單的

Java 音樂播放開發學習之——音訊檔案播放

Java Sound API是javaSE平臺提供底層的(low-level)處理聲音介面,可以實現音訊檔案的播放。 其核心包括:   AudioSystem AudioInputStream AudioFormat DataLine.Info S

VS2008下VLC播放實現播放、暫停、停止、進、截圖、進度條顯示、進度條控制功能

可以直接使用的原始碼:http://download.csdn.net/detail/dafenqie/9792806 1、首先建立一個基於對話方塊的應用程式; 2、建立完成後,把VLC的標頭檔案目錄vlc拷貝到工程目錄下,拷貝libvlc.dll、libvlccore.d

01_網頁源碼查看基本實現

alt host 基本實現 手機 com 技術分享 流量 基本 查看 安卓上面敲127.0.0.1或者是localhost是不行的,安卓上面的localhost/127.0.0.1默認是10.0.2.2.有些第三方的模擬器可能不是這個值。安卓自帶的模擬器

Windows平臺下結合 tortoiseSVN 和 VisualSVN Server 搭建SVN服務實現 web 站點同步

tar 效果 sql services 文檔 src 版本 att file 1. tortoiseSVN 關於 tortoiseSVN 的安裝使用詳見博文 TortoiseSVN的安裝及其簡單使用。 2. VisualSVN Server 關於 VisualS

Lily_music 網頁音樂播放 -可搜尋(附歌詞聯動播放效果解說)

部落格地址:https://ainyi.com/#/59 寫在前面 這是我今年(2018)年初的小專案,當時也是手賤,不想用別的播放器,想著做一個自己的網頁播放器,有個歌曲列表、可關鍵詞搜尋、歌詞滾動播放的效果,於是乎,就做了這一個 Lily_music 當時的感慨 有好幾天沒有發表

Android應用開發 MP3音樂播放程式碼實現

分享一下我老師大神的人工智慧教程!零基礎,通俗易懂!http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識,造福人民,實現我們中華民族偉大復興!        

Android開發-基於ijkplayer框架開發網路電視直播播放實現

前 言 ijkplayer框架是由B站在GitHub開源的一款比較好用的開源網路播放器框架,它能支援在Android、IOS等平臺上編譯移植使用。而且支援多種視訊格式的播放,而且編碼的速度比傳統的開源網路播放器還要快。除此之外,ijkplayer框架支援網路視訊播放時彈幕的推送等功能

ffmpeg簡易播放實現-最簡版

實驗平臺:openSUSE Leap 42.3 ffmpeg版本:4.1 SDL版本:2.0.9 基於ffmpeg 4.1實現簡易視訊播放器,主要分為讀取視訊檔案解碼和呼叫SDL顯示兩大部分。具體流程可參考程式碼註釋。程式碼實現主要參考如下兩篇文章: 最簡單的基於FFMPEG+SDL的視訊播放器ver2(採

ffmpeg簡易播放實現-完善版

實驗平臺:openSUSE Leap 42.3 FFmpeg版本:4.1 SDL版本:2.0.9 基於FFmpeg和SDL實現的簡易視訊播放器,主要分為讀取視訊檔案解碼和呼叫SDL顯示兩大部分。詳細流程可參考程式碼註釋。 本篇實驗筆記主要參考如下兩篇文章: [1]. 最簡單的基於FFMPEG+SDL的視訊播

ffmpeg簡易播放實現-音訊播放

基於FFmpeg和SDL實現的簡易視訊播放器,主要分為讀取視訊檔案解碼和呼叫SDL顯示兩大部分。詳細流程可參考程式碼註釋。 本篇實驗筆記主要參考如下兩篇文章: [1]. 最簡單的基於FFMPEG+SDL的視訊播放器ver2(採用SDL2.0) [2]. An ffmpeg and SDL Tutorial

Android應用開發 MP3音樂播放程式碼實現

                Android應用開發--MP3音樂播放器程式碼實現(一)需求1:將記憶體卡中的MP3音樂讀取出來並顯示到列表當中1.   從資料庫中查詢所有音樂資料,儲存到List集合當中,List當中存放的是Mp3Info物件2.   迭代List集合,把每一個Mp3Info物件的所有屬性

Android應用開發 MP3音樂播放程式碼實現

                Android應用開發--MP3音樂播放器程式碼實現(二)2013年5月25日 簡、美音樂播放器開發小巫在這裡羅列這個播放器已經實現的功能:1.   自動顯示音樂列表2.   點選列表播放音樂3.   長按列表彈出對話方塊4.   暫停音樂5.   上一首音樂6.   下一首音

Android應用開發 MP3音樂播放Service實現

package com.wwj.sb.service;import java.util.List;import android.annotation.SuppressLint;import android.app.Service;import android.content.BroadcastReceiver

關於蘋果自帶的音樂播放 如何實現單曲

一直覺得蘋果的音樂播放器比較坑。 但是,用了qq音樂播放器,發現,我竟然沒法把電腦裡的音樂匯入到手機裡。更坑。 必須重用蘋果的音樂播放器。下簡稱MP(music player)。 因為學英語,必須要單曲

Qt 音樂播放實現點選窗體外的地方該視窗自動關閉

最近在模仿網易雲播放器的時候遇到這個問題:點選"播放列表"彈出音樂列表窗體,點選該窗體的其他的地方。該視窗自動關閉,如下所示: (ps:錄屏的時候,滑鼠顯示不出來,尷尬!) 為此,記錄實現該種效果的方法: //建立該物件的時候,設定座標和大小都為0 m_pMusicPlayList

android 四大元件service 音樂播放實現

新建立一個Android工程《音樂播放器》,包名:com.itheima.musicPlayer。 在res目錄下新建一個資料夾raw(名字必須為raw,約定大於配置的原則),然後在raw目錄中拷貝進一個音樂檔案,注意檔名必須遵循Android資原始檔的命名

安卓仿網易雲介面的本地音樂播放實現

前言:讀研究生之前,老闆讓學IOS,老老實實看了一個學期的IOS(在這裡強烈安利一下騰訊課堂的小碼哥IOS視訊,基本剛開始只需要10塊買第一部,後面的就可以用可視幣來兌換了,質量還不錯,能學到很多東西,看三部基本IOS就能入門了),結果開學提前兩個月被叫去幹活,一開會,說IO

一個音樂播放Vue實現(音樂唱片,點選下面播放,中間的圖片可以轉起來。)

https://www.jb51.net/article/134491.htm 需求:做一個類似於下圖所示的音樂唱片,中間暫時用本地圖片,點選下面播放,中間的圖片可以轉起來。 效果: html <div id="musicImage"> <div class="