我在互联网上找到此链接，该链接演示了WebRTC的工作方式https://shanetully.com/2014/09/a-dead-simple-webrtc-example/
它的源代码在这里https://github.com/shanet/WebRTC-Example
现在，我尝试遵循该示例，并在此处进行以下操作：
1-我创建了一个文件夹名称 voicechat
2-我在里面创建了2个文件夹voicechat。那是voicechat\client＆voicechat\server
3-我将index.html＆webrtc.js放入voicechat\client
4-我把server.js成voicechat\server
5-我将该文件夹voicechat放入Tomcatwebapps文件夹中。所以路径会像这样C:\apache-tomcat-7.0.53\webapps\ROOT\voicechat
6-我启动了Tomcat。
7-我在PC上打开了http://xxx.xxx.xxx.xxx/voicechat/client/index.html，并且该网页显示了PC的摄像头（摄像头1）。没问题。
8-我在另一台PC上打开了http://xxx.xxx.xxx.xxx/voicechat/client/index.html，该网页还显示了另一台PC的网络摄像头（网络摄像头2）。但是我看不到PC的网络摄像头1。当我在PC上讲话时，坐在其他PC上的人听不到我在说什么，反之亦然。
那么，为什么它不起作用？我做错了什么？
这是3个文件的代码：
index.html
<html>
<head>
<script src="webrtc.js"></script>
</head>
<body>
<video id="localVideo" autoplay muted style="width:40%;"></video>
<video id="remoteVideo" autoplay style="width:40%;"></video>
<br />
<input type="button" id="start" onclick="start(true)" value="Start Video"></input>
<script type="text/javascript">
pageReady();
</script>
</body>
</html>
webrtc.js
var localVideo;
var remoteVideo;
var peerConnection;
var peerConnectionConfig = {'iceServers': [{'url': 'stun:stun.services.mozilla.com'}, {'url': 'stun:stun.l.google.com:19302'}]};
navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
window.RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
window.RTCIceCandidate = window.RTCIceCandidate || window.mozRTCIceCandidate || window.webkitRTCIceCandidate;
window.RTCSessionDescription = window.RTCSessionDescription || window.mozRTCSessionDescription || window.webkitRTCSessionDescription;
function pageReady() {
localVideo = document.getElementById('localVideo');
remoteVideo = document.getElementById('remoteVideo');
serverConnection = new WebSocket('ws://127.0.0.1:3434');
serverConnection.onmessage = gotMessageFromServer;
var constraints = {
video: true,
audio: true,
};
if(navigator.getUserMedia) {
navigator.getUserMedia(constraints, getUserMediaSuccess, errorHandler);
} else {
alert('Your browser does not support getUserMedia API');
}
}
function getUserMediaSuccess(stream) {
localStream = stream;
localVideo.src = window.URL.createObjectURL(stream);
}
function start(isCaller) {
peerConnection = new RTCPeerConnection(peerConnectionConfig);
peerConnection.onicecandidate = gotIceCandidate;
peerConnection.onaddstream = gotRemoteStream;
peerConnection.addStream(localStream);
if(isCaller) {
peerConnection.createOffer(gotDescription, errorHandler);
}
}
function gotMessageFromServer(message) {
if(!peerConnection) start(false);
var signal = JSON.parse(message.data);
if(signal.sdp) {
peerConnection.setRemoteDescription(new RTCSessionDescription(signal.sdp), function() {
peerConnection.createAnswer(gotDescription, errorHandler);
}, errorHandler);
} else if(signal.ice) {
peerConnection.addIceCandidate(new RTCIceCandidate(signal.ice));
}
}
function gotIceCandidate(event) {
if(event.candidate != null) {
serverConnection.send(JSON.stringify({'ice': event.candidate}));
}
}
function gotDescription(description) {
console.log('got description');
peerConnection.setLocalDescription(description, function () {
serverConnection.send(JSON.stringify({'sdp': description}));
}, function() {console.log('set description error')});
}
function gotRemoteStream(event) {
console.log('got remote stream');
remoteVideo.src = window.URL.createObjectURL(event.stream);
}
function errorHandler(error) {
console.log(error);
}
server.js
var WebSocketServer = require('ws').Server;
var wss = new WebSocketServer({port: 3434});
wss.broadcast = function(data) {
for(var i in this.clients) {
this.clients[i].send(data);
}
};
wss.on('connection', function(ws) {
ws.on('message', function(message) {
console.log('received: %s', message);
wss.broadcast(message);
});
});
server.js旨在作为Websocket信令的节点服务器运行。使用运行它node server.js。您根本不需要Tomcat。
从项目自述文件中：
信令服务器使用Node.js和ws，可以这样启动：
$ npm install ws
$ node server/server.js
在客户端运行的情况下，在Firefox或Chrome的最新版本中打开client / index.html。
您可以仅使用文件URL打开index.html。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句