概述
metaRTC4.0新版本支持webrtc版的p2p,支持一对一和一对多应用,在应用中浏览器作为终端应用比较广,metaRTC提供有metaRTC和浏览器p2p通信demo,工程为metap2p4_html。
metartc4.0新版本支持和浏览器进行音视频和datachannel双向通信,实现和浏览器进行音视频对讲功能。
remark:浏览器demo在谷歌浏览器测试成功,其他浏览器还没测试。
metap2p4_html工程demo
- p2pdemo_zb.html 从metap2p4只拉流和datachannel双向通信
- p2pdemo_hd.html 和metap2p4音视频对讲,简单的p2p视频会议,datachannel双向通信
下载源码
Release metartc4.016 with 3rdparty and runtime · metartc/metaRTC · GitHubWebrtc SDK for pure C. Contribute to metartc/metaRTC development by creating an account on GitHub.https://github.com/metartc/metaRTC/releases/tag/4.0.016https://gitee.com/metartc/metaRTC/releases/4.0.016https://gitee.com/metartc/metaRTC/releases/4.0.016
p2pdemo_hd.html操作
p2pdemo_zb.html
p2pdemo_hd.html代码
function start_play(){
let elr = document.getElementById("resilution");
let res = elr.options[elr.selectedIndex].text.match(/\d+/g);
let h = parseInt(res.pop());
let w = parseInt(res.pop());
let urlstr=document.getElementById('streamUrl').value.replace("webrtc:","http:");
//urlstr="http://127.0.0.1/index/api/webrtc?app=live&stream=test&type=echo";
player = new ZLMRTCClient.Endpoint(
{
element: document.getElementById('video'),// video 标签
debug: true,// 是否打印日志
zlmsdpUrl:urlstr,//流地址
simulcast:false,
useCamera:true, //使用摄像头
audioEnable:true, //是否有语音
videoEnable:true,//是否有视频
recvOnly:recvOnly,
resolution:{w:w,h:h},//分辨率
usedatachannel:true,//是否启用datachannel
}
);
player.on(ZLMRTCClient.Events.WEBRTC_ICE_CANDIDATE_ERROR,function(e)
{// ICE 协商出错
console.log('ICE 协商出错')
});
player.on(ZLMRTCClient.Events.WEBRTC_ON_REMOTE_STREAMS,function(e)
{//获取到了远端流,可以播放
console.log('播放成功',e.streams)
});
player.on(ZLMRTCClient.Events.WEBRTC_OFFER_ANWSER_EXCHANGE_FAILED,function(e)
{// offer anwser 交换失败
console.log('offer anwser 交换失败',e)
stop();
});
player.on(ZLMRTCClient.Events.WEBRTC_ON_LOCAL_STREAM,function(s)
{// 获取到了本地流
document.getElementById('selfVideo').srcObject=s;
document.getElementById('selfVideo').muted = true;
//console.log('offer anwser 交换失败',e)
});
player.on(ZLMRTCClient.Events.CAPTURE_STREAM_FAILED,function(s)
{// 获取本地流失败
console.log('获取本地流失败')
});
player.on(ZLMRTCClient.Events.WEBRTC_ON_CONNECTION_STATE_CHANGE,function(state)
{// RTC 状态变化 ,详情参考 https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/connectionState
console.log('当前状态==>',state)
});
player.on(ZLMRTCClient.Events.WEBRTC_ON_DATA_CHANNEL_OPEN,function(event)
{
console.log('rtc datachannel 打开 :',event)
});
player.on(ZLMRTCClient.Events.WEBRTC_ON_DATA_CHANNEL_MSG,function(event)
{
console.log('rtc datachannel 消息 :',event.data)
document.getElementById('msgrecv').value = event.data
});
player.on(ZLMRTCClient.Events.WEBRTC_ON_DATA_CHANNEL_ERR,function(event)
{
console.log('rtc datachannel 错误 :',event)
});
player.on(ZLMRTCClient.Events.WEBRTC_ON_DATA_CHANNEL_CLOSE,function(event)
{
console.log('rtc datachannel 关闭 :',event)
});
}
参数设置代码
player = new ZLMRTCClient.Endpoint(
{
element: document.getElementById('video'),// video 标签
debug: true,// 是否打印日志
zlmsdpUrl:urlstr,//流地址
simulcast:false,
useCamera:true, //使用摄像头
audioEnable:true, //是否有语音
videoEnable:true,//是否有视频
recvOnly:recvOnly,
resolution:{w:w,h:h},//分辨率
usedatachannel:true,//是否启用datachannel
}
);