好吧...。因此,我遵循了一个教程,并创建了一个站点,您可以在其中编码并与其他用户共享您的Codemirror编辑器和视频通话。我正在使用对等js,并且已将项目上传到heroku进行测试。
该网站正在运行,但存在问题: 我叫另一个用户,他的视频在我的浏览器中可见,但他看不到我的视频,只有他自己的视频。 我在控制台中收到以下错误:
PeerJS: Failed to setLocalDescription, (OperationError) Failed to set local offer sdp: Called in wrong state: kHaveRemoteOffer
我正在使用peerjs版本0.3.8,因为最新版本刚刚删除了连接。以下是我的对等服务器的代码:
const express = require('express');
const path = require('path');
const http = require('http');
const cors = require('cors');
const errorhandler = require('errorhandler');
var ExpressPeerServer = require('peer').ExpressPeerServer;
var options = {
debug: true
};
var app = express();
var server = http.createServer(app);
var port = process.env.PORT || '3000';
app.set('port', port);
app.use(cors());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/peerjs', ExpressPeerServer(server, options));
app.use(errorhandler());
process.on('uncaughtException', function(exc) {
console.error(exc);
});
server.listen(port);
我正在task.hbs视图文件中使用以下脚本来创建连接:
// PeerJS
// Compatibility shim
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
// PeerJS object
var peer = new Peer(username + roomId, {
host: 'stark-waters-87626.herokuapp.com',
path: '/peerjs',
port: 443,
secure: true,
debug: true
});
peer.on('open', function () {
$('#my-id').text(peer.id);
});
// Receiving a call
peer.on('call', function (call) {
// Answer the call automatically (instead of prompting user) for demo purposes
call.answer(window.localStream);
step3(call);
});
peer.on('error', function (err) {
alert(err.message);
// Return to step 2 if error occurs
step2();
});
// Click handlers setup
$(function () {
$('#make-call').click(function () {
// Initiate a call!
var call = peer.call($('#callto-id').val(), window.localStream);
step3(call);
});
$('#end-call').click(function () {
window.existingCall.close();
step2();
});
step1();
});
function step1() {
// Get audio/video stream
navigator.getUserMedia({ audio: true, video: true }, function (stream) {
// Set your video displays
$('#my-video').prop('src', URL.createObjectURL(stream));
window.localStream = stream;
step2();
}, function () { $('#step1-error').show(); });
}
function step2() {
$('#step1, #step3').hide();
$('#step2').show();
}
function step3(call) {
// Hang up on an existing call if present
if (window.existingCall) {
window.existingCall.close();
}
// Wait for stream on the call, then set peer video display
call.on('stream', function (stream) {
$('#second-video').prop('src', URL.createObjectURL(stream));
});
// UI stuff
window.existingCall = call;
$('#second-id').text(call.peer);
call.on('close', step2);
$('#step1, #step2').hide();
$('#step3').show();
}
以下是它在我能看到远程用户的窗口中的屏幕截图:
在我打开了远程用户视频的另一个浏览器窗口中没有出现: