此博文省略了流媒體服務器組建(網絡管理員的事)。
把下面的js代碼,另存為LiveBroadcast.js文件,存在專案中的js目錄中:

function Fulls() {
try {
if (document.all.Media.playState == 3) { document.all.Media.fullscreen = 1; }
}
catch (e) {
alert("您已經打開了另一個播放窗口,不能全屏觀看,請關閉其它的播放窗口再全屏觀看。");
}
}
function checkplay() {
var i = document.all.Media.playState;
window.status = "歡迎來到直播室...數據偵測中 ....";
info.style.display = "";
info.innerHTML = " 歡迎來到直播室...數據偵測中... "
if (i == 10) {
document.all.Media.Url = strurl;
window.status = "未發現直播數據,嘗試重新連接,請稍候...";
info.style.display = "";
info.innerHTML = " 未發現直播數據,嘗試重新連接,... "
}
if (i == 1) {
document.all.Media.Url = strurl;
window.status = "播放結束..,嘗試重新連接..";
info.style.display = "";
info.innerHTML = " 播放結束..,嘗試重新連接.. "
}
if (i == 2) {
document.all.Media.Url = strurl;
window.status = "直播斷開,系統重新連接,請稍候...";
info.innerHTML = " 直播暫停,等待中,請稍候... "
info.style.display = "";
}
if (i == 7) {
document.all.Media.Url = strurl;
window.status = "直播斷開,系統重新連接,請稍候...";
info.style.display = "";
info.innerHTML = " 直播暫停,等待中,請稍候... "
}
if (i == 3) {
window.status = "已經成功連接到 [Insus.NET網絡科技視頻直播專用服務器] ,正在獲取數據......";
info.style.display = "none";
}
setTimeout("checkplay()", 6000);
}
try {
if (document.all.Media.playState == 3) { document.all.Media.fullscreen = 1; }
}
catch (e) {
alert("您已經打開了另一個播放窗口,不能全屏觀看,請關閉其它的播放窗口再全屏觀看。");
}
}
function checkplay() {
var i = document.all.Media.playState;
window.status = "歡迎來到直播室...數據偵測中 ....";
info.style.display = "";
info.innerHTML = " 歡迎來到直播室...數據偵測中... "
if (i == 10) {
document.all.Media.Url = strurl;
window.status = "未發現直播數據,嘗試重新連接,請稍候...";
info.style.display = "";
info.innerHTML = " 未發現直播數據,嘗試重新連接,... "
}
if (i == 1) {
document.all.Media.Url = strurl;
window.status = "播放結束..,嘗試重新連接..";
info.style.display = "";
info.innerHTML = " 播放結束..,嘗試重新連接.. "
}
if (i == 2) {
document.all.Media.Url = strurl;
window.status = "直播斷開,系統重新連接,請稍候...";
info.innerHTML = " 直播暫停,等待中,請稍候... "
info.style.display = "";
}
if (i == 7) {
document.all.Media.Url = strurl;
window.status = "直播斷開,系統重新連接,請稍候...";
info.style.display = "";
info.innerHTML = " 直播暫停,等待中,請稍候... "
}
if (i == 3) {
window.status = "已經成功連接到 [Insus.NET網絡科技視頻直播專用服務器] ,正在獲取數據......";
info.style.display = "none";
}
setTimeout("checkplay()", 6000);
}
應用樣式:
.chattable {
border-right: #BED6E0 1px solid;
border-top: #BED6E0 1px solid;
border-left: #BED6E0 1px solid;
border-bottom: #BED6E0 1px solid;
font-size: 12px;
line-height: 1.5;
}
border-right: #BED6E0 1px solid;
border-top: #BED6E0 1px solid;
border-left: #BED6E0 1px solid;
border-bottom: #BED6E0 1px solid;
font-size: 12px;
line-height: 1.5;
}
在aspx頁面中的head寫js和引用js文件,Insus.NET在javascript語言塊中,拉了一個literal Web控件,是為了讓后台cs能傳值給js。
<
head
runat
="server"
>
< title ></ title >
< script type ="text/javascript" >
< asp:Literal ID = " Literal1 " runat = " server " >< / asp:Literal>
</ script >
< script src ="Js/LiveBroadcast.js" ></ script >
</ head >
< title ></ title >
< script type ="text/javascript" >
< asp:Literal ID = " Literal1 " runat = " server " >< / asp:Literal>
</ script >
< script src ="Js/LiveBroadcast.js" ></ script >
</ head >
下面是aspx body網頁內代碼,嘩,直接Ctrl + C 然后Ctrl + V即可。

<
body
style
="overflow-x: hidden; overflow-y: auto; margin: 2px;"
onload
="checkplay();"
>
< form id ="form1" runat ="server" >
< div >
< table style ="width: 100%; height: 100%; background-color: #ffffff" class ="chats"
cellspacing ="2" cellpadding ="0" align ="center" border ="0" >
< tr >
< td style ="height: 173px" align ="center" >
< object style ="width: 100%; height: 250px" id ="Media" classid ="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"
name ="Media" >
< param name ="AutoStart" value ="-1" />
< param name ="url" value ='<%= LiveBroadcasePath % >' />
< param name ="stretchToFit" value ="1" />
< param name ="ShowCaptioning" value ="1" />
< param name ="ShowControls" value ="1" />
< param name ="uiMode" value ="None" />
</ object >
< div id ="info" style ="z-index: 101; left: 69px; position: absolute; top: 127px; height: 22px; background-color: snow"
class ="chattable" align ="center" >
數據處理中...
</ div >
</ td >
</ tr >
< tr >
< td align ="center" style ="height: 20px; background-color: black" valign ="middle" >
< table border ="0" cellpadding ="0" cellspacing ="0" style ="width: 100%" >
< tr >
< td style ="width: 81px" >
< input id ="Button1" onclick ="Fulls()" style ="height: 22px" type ="button" value ="全屏觀看" />
</ td >
< td align ="left" >
< asp:Label ID ="lblTitle" runat ="server" ForeColor ="White" >現場直播測試... </ asp:Label >
</ td >
</ tr >
</ table >
</ td >
</ tr >
</ table >
</ div >
</ form >
</ body >
< form id ="form1" runat ="server" >
< div >
< table style ="width: 100%; height: 100%; background-color: #ffffff" class ="chats"
cellspacing ="2" cellpadding ="0" align ="center" border ="0" >
< tr >
< td style ="height: 173px" align ="center" >
< object style ="width: 100%; height: 250px" id ="Media" classid ="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"
name ="Media" >
< param name ="AutoStart" value ="-1" />
< param name ="url" value ='<%= LiveBroadcasePath % >' />
< param name ="stretchToFit" value ="1" />
< param name ="ShowCaptioning" value ="1" />
< param name ="ShowControls" value ="1" />
< param name ="uiMode" value ="None" />
</ object >
< div id ="info" style ="z-index: 101; left: 69px; position: absolute; top: 127px; height: 22px; background-color: snow"
class ="chattable" align ="center" >
數據處理中...
</ div >
</ td >
</ tr >
< tr >
< td align ="center" style ="height: 20px; background-color: black" valign ="middle" >
< table border ="0" cellpadding ="0" cellspacing ="0" style ="width: 100%" >
< tr >
< td style ="width: 81px" >
< input id ="Button1" onclick ="Fulls()" style ="height: 22px" type ="button" value ="全屏觀看" />
</ td >
< td align ="left" >
< asp:Label ID ="lblTitle" runat ="server" ForeColor ="White" >現場直播測試... </ asp:Label >
</ td >
</ tr >
</ table >
</ td >
</ tr >
</ table >
</ div >
</ form >
</ body >
在.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class LiveBroadcast : System.Web.UI.Page
{
private string _LiveBroadcasePath;
public string LiveBroadcasePath
{
get
{
return _LiveBroadcasePath;
}
set
{
_LiveBroadcasePath = value;
}
}
protected void Page_Load( object sender, EventArgs e)
{
Data_Binding();
}
private void Data_Binding()
{
// 媒體流是mms協議。
this._LiveBroadcasePath = " mms://61.136.19.228/live4 ";
this.Literal1.Text = " var strurl=' " + LiveBroadcasePath + " ' ";
}
}
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class LiveBroadcast : System.Web.UI.Page
{
private string _LiveBroadcasePath;
public string LiveBroadcasePath
{
get
{
return _LiveBroadcasePath;
}
set
{
_LiveBroadcasePath = value;
}
}
protected void Page_Load( object sender, EventArgs e)
{
Data_Binding();
}
private void Data_Binding()
{
// 媒體流是mms協議。
this._LiveBroadcasePath = " mms://61.136.19.228/live4 ";
this.Literal1.Text = " var strurl=' " + LiveBroadcasePath + " ' ";
}
}