没有收到视频，onicecandidate没有执行

Question

所以我关注this tutorial以了解如何实现WebRTC服务器 - 客户端设置。一旦我开始工作，我想将客户端分成两部分，一个发送者和一个接收者。现在，他们可以建立彼此的连接，但接收者永远不会从发送者那里获得流。

我设法确定原始代码和拆分版本之间的代码流保持不变，除了两个peer都没有执行onicecandidate事件。

根据this，我需要明确包含OfferToReceiveAudio: true和OfferToReceiveVideo: true，因为我使用的是Chrome，我做了但它似乎没有任何区别

目前，他们都相互接收SDP，peerConnection中有本地和远程描述，而iceGatheringState是＆＃34; new＆＃34;但iceConnectionState是＆＃34;检查＆＃34; （不像第二个链接，他说它也应该是＆＃34; new＆＃34;）

当ICE候选人分成两部分时，他们怎么会交换呢？

Sender.js

＆＃13;

＆＃13;

const HTTPSPort = 3434;
const domain = '127.0.0.1';
const wssHost = 'wss://' + domain + ':' + HTTPSPort + '/websocket/';

// Feed settings
const video = true;
const audio = true;
const constraints = { "audio": audio, "video": video };

var videoContainer = null, feed = null,
	pC = null, wsc = new WebSocket(wssHost),
	pCConfig = [
		{ 'url': 'stun:stun.services.mozilla.com' },
		{ 'url': 'stun:stun.l.google.com:19302' }
	];

function pageReady() {
	// Check browser WebRTC availability
	navigator.mediaDevices.getUserMedia(constraints).then(function (stream) {
		videoContainer = document.getElementById('videoFeed');

		// Get the feed and show it in the local video element
		feed = stream;
		videoContainer.srcObject = feed;
	}).catch(function () {
		alert("Sorry, your browser does not support WebRTC!");
	});
}

wsc.onmessage = function (evt) {
	if (!pC) {
		// Initiate peerConnection
		pC = new RTCPeerConnection(pCConfig);

		// Send any ice candidates to the other peer
		pC.onicecandidate = onIceCandidateHandler;

		pC.addStream(feed);
	}

	// Read the message
	var signal = JSON.parse(evt.data);
	if (signal.sdp) {
		log('Received SDP from remote peer.');
		pC.setRemoteDescription(new RTCSessionDescription(signal.sdp));

		answerCall();
	} else if (signal.candidate) {
		log('Received ICECandidate from remote peer.');
		pC.addIceCandidate(new RTCIceCandidate(signal.candidate));
	}
};

function answerCall() {
	pC.createAnswer().then(function (answer) {
		var ans = new RTCSessionDescription(answer);
		pC.setLocalDescription(ans).then(function () {
			wsc.send(JSON.stringify({ 'sdp': ans }));
		}).catch(errorHandler);
	}).catch(errorHandler);
}

function onIceCandidateHandler(evt) {
	if (!evt || !evt.candidate) return;

	wsc.send(JSON.stringify({ 'candidate': evt.candidate }));
};

＆＃13;

＆＃13;

＆＃13;

Receiver.js

＆＃13;

＆＃13;

const HTTPSPort = 3434;
const domain = '127.0.0.1';
const wssHost = 'wss://' + domain + ':' + HTTPSPort + '/websocket/';

var remoteVideo = null,
	pC = null, wsc = new WebSocket(wssHost),
	pCConfig = [
		{ 'url': 'stun:stun.services.mozilla.com' },
		{ 'url': 'stun:stun.l.google.com:19302' }
	],
	mediaConstraints = {
		mandatory: {
			OfferToReceiveAudio: true,
			OfferToReceiveVideo: true
		}
	};

function pageReady() {
	remoteVideo = document.getElementById('remoteVideo');
	icebutton = document.getElementById('checkICE');
	icebutton.addEventListener('click', function (evt) {
		console.log(pC);
	})
};

wsc.onopen = function () {
	// Initiates peerConnection
	pC = new RTCPeerConnection(pCConfig);

	// Send any ICE candidates to the other peer
	pC.onicecandidate = onIceCandidateHandler;

	// Once remote stream arrives, show it in the remote video element
	pC.onaddstream = onAddStreamHandler;

	// Offer a connection to the server
	createAndSendOffer();
};

function createAndSendOffer() {
	pC.createOffer(mediaConstraints).then(function (offer) {
		var off = new RTCSessionDescription(offer);
		pC.setLocalDescription(off).then(function () {
			wsc.send(JSON.stringify({ 'sdp': off }));
		}).catch(errorHandler);
	}).catch(errorHandler);
}

wsc.onmessage = function (evt) {
	// Read the message
	var signal = JSON.parse(evt.data);

	if (signal.sdp) {
		console.log('Received SDP from remote peer.');
		pC.setRemoteDescription(new RTCSessionDescription(signal.sdp));
	} else if (signal.candidate) {
		console.log('Received ICECandidate from remote peer.');
		pC.addIceCandidate(new RTCIceCandidate(signal.candidate));
	}
};

function onIceCandidateHandler(evt) {
	if (!evt || !evt.candidate) return;

	wsc.send(JSON.stringify({ 'candidate': evt.candidate }));
};

function onAddStreamHandler(evt) {
	// Set remote video stream as source for remote video HTML element
	remoteVideo.srcObject = evt.stream;
};

＆＃13;

＆＃13;

＆＃13;

Answer 1

你忘记了iceServers。变化

pCConfig = [
    { 'url': 'stun:stun.services.mozilla.com' },
    { 'url': 'stun:stun.l.google.com:19302' }
];

到

pCConfig = {
    iceServers: [
        { urls: 'stun:stun.l.google.com:19302' }
    ]
};

此外：

• url有been deprecated，使用urls。
• mozilla眩晕服务器已经decommissioned，所以请节省一些时间并将其排除。
• mandatory和OfferToReceiveAudio有been deprecated。使用offerToReceiveAudio。
• mandatory和OfferToReceiveVideo有been deprecated。使用offerToReceiveVideo。

提示

使用promises的荣誉（与教程不同）！请注意，您可以return them来展平：

function createAndSendOffer() {
    return pC.createOffer(mediaConstraints).then(function (offer) {
        return pC.setLocalDescription(offer);
    })
    .then(function () {
        wsc.send(JSON.stringify({ sdp: pC.localDescription }));
    })
    .catch(errorHandler);
}