【发布时间】：2021-05-09 18:04:49
【问题描述】：
我正在尝试使用socket.io 编写WebRTC 应用程序。
信令服务器是用python写的，长这样。
import socketio
import uvicorn
from starlette.applications import Starlette
ROOM = 'room'
sio = socketio.AsyncServer(async_mode='asgi', cors_allowed_origins='*')
star_app = Starlette(debug=True)
app = socketio.ASGIApp(sio, star_app)
@sio.event
async def connect(sid, environ):
await sio.emit('ready', room=ROOM, skip_sid=sid)
sio.enter_room(sid, ROOM)
@sio.event
async def data(sid, data):
await sio.emit('data', data, room=ROOM, skip_sid=sid)
@sio.event
async def disconnect(sid):
sio.leave_room(sid, ROOM)
if __name__ == '__main__':
uvicorn.run(app, host='0.0.0.0', port=8003)
客户端是这样的
<script>
const SIGNALING_SERVER_URL = 'http://127.0.0.1:8003?session_id=1';
// WebRTC config: you don't have to change this for the example to work
// If you are testing on localhost, you can just use PC_CONFIG = {}
const PC_CONFIG = {};
// Signaling methods
let socket = io(SIGNALING_SERVER_URL, {autoConnect: false});
socket.on('data', (data) => {
console.log('Data received: ', data);
handleSignalingData(data);
});
socket.on('ready', () => {
console.log('Ready');
// Connection with signaling server is ready, and so is local stream
createPeerConnection();
sendOffer();
});
let sendData = (data) => {
socket.emit('data', data);
};
// WebRTC methods
let pc;
let localStream;
let remoteStreamElement = document.querySelector('#remoteStream');
let getLocalStream = () => {
navigator.mediaDevices.getUserMedia({audio: true, video: true})
.then((stream) => {
console.log('Stream found');
localStream = stream;
// Connect after making sure that local stream is availble
socket.connect();
})
.catch(error => {
console.error('Stream not found: ', error);
});
}
let createPeerConnection = () => {
try {
pc = new RTCPeerConnection(PC_CONFIG);
pc.onicecandidate = onIceCandidate;
pc.onaddstream = onAddStream;
pc.addStream(localStream);
console.log('PeerConnection created');
} catch (error) {
console.error('PeerConnection failed: ', error);
}
};
let sendOffer = () => {
console.log('Send offer');
pc.createOffer().then(
setAndSendLocalDescription,
(error) => {
console.error('Send offer failed: ', error);
}
);
};
let sendAnswer = () => {
console.log('Send answer');
pc.createAnswer().then(
setAndSendLocalDescription,
(error) => {
console.error('Send answer failed: ', error);
}
);
};
let setAndSendLocalDescription = (sessionDescription) => {
pc.setLocalDescription(sessionDescription);
console.log('Local description set');
sendData(sessionDescription);
};
let onIceCandidate = (event) => {
if (event.candidate) {
console.log('ICE candidate');
sendData({
type: 'candidate',
candidate: event.candidate
});
}
};
let onAddStream = (event) => {
console.log('Add stream');
remoteStreamElement.srcObject = event.stream;
};
let handleSignalingData = (data) => {
// let msg = JSON.parse(data);
switch (data.type) {
case 'offer':
createPeerConnection();
pc.setRemoteDescription(new RTCSessionDescription(data));
sendAnswer();
break;
case 'answer':
pc.setRemoteDescription(new RTCSessionDescription(data));
break;
case 'candidate':
pc.addIceCandidate(new RTCIceCandidate(data.candidate));
break;
}
};
// Start connection
getLocalStream();
</script>
我也将此代码用于客户端作为 socket.io
https://github.com/socketio/socket.io/blob/master/client-dist/socket.io.js
当两个人处于联系中时，一切都会很好。 但是一旦第三个用户尝试连接到他们，流式传输就会停止并出现错误
未捕获（承诺中）DOMException：执行失败 “RTCPeerConnection”上的“setRemoteDescription”：无法设置远程 answer sdp：在错误状态下调用：stable
我对@987654328@ 了解不多，所以我需要你的帮助。谢谢。
附注我在所有浏览器中都看到了这个错误。
查看此存储库
https://github.com/pfertyk/webrtc-working-example
查看此说明
【问题讨论】：
-
RTCPeerConnection 是两个对等点/一对对等点之间的连接。要获得完全连接，您需要为每个远程对等方创建单独的连接 - 通常对于您的
n用户，每个人都必须拥有n - 1连接。似乎在您的情况下 - 对于第三个用户 - 您尝试重新使用现有连接而不是创建新连接。 -
你是对的......
-
但是我不知道怎么解决
-
@unknown，为每个peer创建一个peerconnection...
-
@unknown，这次我添加了一个带有一些示例代码的新解决方案，我相信这就是您要寻找的。span>
标签： javascript python socket.io webrtc streaming