我正在使用webRTC应用进行视频广播。 该应用程序的工作方式。 - 客户A创建一个频道;看到他的本地Feed显示(从/ room加载的内容),然后等待。 - 客户B加载页面,点击频道加入页面。
一切正常,但客户端B获取黑色视频元素,其中包含MediaStream对象。日志似乎很好......我迷路了,请看看! 我会尽可能清楚地尝试和评论,但如果需要,请提出解释。
脚本如下:
var pc_config = {"iceServers": [{"url": "stun:stun.l.google.com:19302"}]};
var pC = null;
var localStream = null;
var emitter = false;
var mediaConstraints = {'mandatory': {
'OfferToReceiveAudio':false,
'OfferToReceiveVideo':false }};
var setLocal = function (sdp) {
pC.setLocalDescription(sdp);
console.log("Sending: SDP");
console.log(sdp);
socket.json.send(sdp);
};
function onRemoteStreamAdded(event) {
console.log("Added remote stream" + event);
video.src = window.URL.createObjectURL(event.stream);
video.play();
}
function createPeerConnection() {
console.log("Creating peer connection");
pc_config.iceServers.push({
"url": "turn:" + 'shirase.dev%40gmail.com' + "@" + 'numb.viagenie.ca',
"credential": 'drkllr'
});
try {
pC = new RTCPeerConnection(pc_config);
console.log("Created peer connection" + pc_config);
} catch (e) {
console.log("Failed to create Peer Connection, exception: " + e.message);
}
pC.addEventListener("addstream", onRemoteStreamAdded, false);//receiver
started = true;
pC.onicecandidate = function(evt) {
if (evt.candidate) {
console.log('Sending ICE candidate...');
console.log(evt.candidate);
socket.json.send({
type: "candidate",
sdpMLineIndex: evt.candidate.sdpMLineIndex,
sdpMid: evt.candidate.sdpMid,
candidate: evt.candidate.candidate
});
} else {
console.log("End of candidates.");
}
};
套接字事件是:
var video = document.getElementById('video'),
started = false;
var channel = {
create: function(){
socket.emit('create');
return false;
},
join: function(channelId){
socket.emit('join', channelId);
return false;
}
};
socket.on('channel_created', function () {
$.get('/room', function(data) {
$('#content').html(data);
});
emitter = true;
});
//fired by socket server when a new user joins
socket.on('user_joined', function () {
console.log('received');
createPeerConnection();
pC.addStream(localStream);//emitter
console.log(pC);
started = true;
pC.createOffer(setLocal,null,mediaConstraints);
});
//peerconnection events from socket
socket.on('message', function (evt) {
if (evt.type === 'offer') {
console.log("Received offer...");
createPeerConnection();
console.log('Creating remote session description...' );
pC.setRemoteDescription(new RTCSessionDescription(evt));
console.log('Sending answer...');
pC.createAnswer(setLocal,null,mediaConstraints);
} else if (evt.type === 'answer' && emitter) {
console.log('Received answer...');
console.log('Setting remote session description...' + evt);
pC.setRemoteDescription(new RTCSessionDescription(evt));
} else if (evt.type === 'candidate' && started) {
console.log('Received ICE candidate...');
var candidate = new RTCIceCandidate({
sdpMLineIndex: evt.sdpMLineIndex,
sdpMid: evt.sdpMid,
candidate: evt.candidate
});
console.log(candidate);
pC.addIceCandidate(candidate);
} else if (evt.type === 'bye') {
console.log("Received bye");
stop();
}
});
测试: 启动客户端A,然后B.控制台打印后:
在A:
Creating peer connection
Created peer connection[object Object]
Sending: SDP
Sending ICE candidate...
**A few of those **
Received answer...
Setting remote session description...
在B:
Received offer...
Creating peer connection
Created peer connection[object Object]
Creating remote session description...
Sending answer...
Received ICE candidate...
**A few of those**
Added remote stream[object MediaStreamEvent]
Sending: SDP
并出现黑色视频元素......
有什么想法吗?
答案 0 :(得分:1)
为true
和OfferToReceiveAudio
设置值OfferToReceiveVideo
:
var mediaConstraints = {
'mandatory': {
'OfferToReceiveAudio': true,
'OfferToReceiveVideo': true
}
};
这些仅适用于仅数据会话{。}}。