在我的项目中,我具有音频和视频1-1(群呼)功能。通过通话,用户也可以共享屏幕。在视频通话中,我实现了屏幕共享,并且可以完美地工作,但是在音频通话中,屏幕共享无法正常工作。我不确定为什么会这样。
屏幕共享流能够生成,但另一方面,它给了我这个错误。 DOMException:无法在“ RTCPeerConnection”上执行“ addIceCandidate”:处理ICE候选者时出错 有时它显示此错误,有时它不显示任何错误,流也不会添加到另一侧。我不明白为什么会这样。
下面是我添加新候选人的代码。错误在这里发生。
this.chatService.onVideoCandidate().subscribe((data: any) => {
console.log("in candidate socket event", data);
this.peerConnections[data.socketId]
.addIceCandidate(new RTCIceCandidate(data.message))
.catch(e => {
console.log("in error", e);
console.error(e);
});
});
下面是我当前用于处理音频事件的代码。
/ *出现新连接时* /
this.chatService.onVideoReady().subscribe((data: any) => {
const id = data.id;
const type = data.data.type;
console.log(" id in videoready", id);
if (id) {
if (!this.localStream) {
console.log("in return video ready");
return;
}
let peerConnection = null;
peerConnection = new RTCPeerConnection(this.config);
this.peerConnections[id] = peerConnection;
if (this.localStream) {
peerConnection.addStream(this.localStream);
}
peerConnection
.createOffer()
.then(sdp => {
peerConnection.setLocalDescription(sdp);
})
.then(() => {
console.log("peer id", id);
if (this.isScreenShare === true) {
const data = {
type: "screen",
userName:
this.userData.firstName + " " + this.userData.lastName,
userProfilePicture: this.userData.profilePictureURL
};
this.chatService.VideoOffer(
id,
peerConnection["localDescription"],
data
);
} else {
const data = {
type: "face",
userName:
this.userData.firstName + " " + this.userData.lastName,
userProfilePicture: this.userData.profilePictureURL
};
this.chatService.VideoOffer(
id,
peerConnection["localDescription"],
data
);
}
})
.catch(err => {
console.log("error in onVideoready", err);
});
peerConnection.onaddstream = event =>
this.handleRemoteStreamAdded(event.stream, id, data.data);
peerConnection.onicecandidate = event => {
if (event.candidate) {
this.chatService.VideoCandidate(id, event.candidate);
}
};
}
});
/ *关于视频优惠* /
this.chatService.onVideoOffer().subscribe((data: any) => {
console.log("in offer socket event", data);
let peerConnection: any = null;
peerConnection = new RTCPeerConnection(this.config);
this.peerConnections[data.socketId] = peerConnection;
peerConnection.addStream(this.localStream);
peerConnection
.setRemoteDescription(data.message)
.then(() => peerConnection.createAnswer())
.then(sdp => peerConnection.setLocalDescription(sdp))
.then(() => {
console.log(
"login person id",
this.utilService.getCurrentLoginUserProfileId()
);
let answerData = {};
answerData = {
roomId: this.roomId,
answeringUser: this.utilService.getCurrentLoginUserProfileId()
};
this.chatService.VideoAnswer(
data.socketId,
peerConnection.localDescription,
answerData
);
});
peerConnection.onaddstream = event =>
this.handleRemoteStreamAdded(event.stream, data.socketId, data.data);
peerConnection.onicecandidate = event => {
if (event.candidate) {
this.chatService.VideoCandidate(data.socketId, event.candidate);
}
};
});
/ *关于视频答案* /
this.chatService.onVideoAnswer().subscribe((data: any) => {
this.peerConnections[data.socketId].setRemoteDescription(data.message);
});
/ *启动屏幕共享的功能* /
startScreenShare() {
navigator.mediaDevices["getDisplayMedia"](this.screenContraints)
.then(stream => {
this.isScreenShare = true;
console.log("in start screen share stream", stream);
this.screenShareStream = stream;
if (stream) {
this.getUserMediaSuccess(stream);
stream.oninactive = () => {
this.isScreenShare = false;
if (!this.hangedUpWhileSSActive) {
// checks if the user wants to hang up or wants to continue with the video streaming
console.log('screen share failed');
navigator.mediaDevices
.getUserMedia(this.constraints)
.then(stream => {
this.getUserMediaSuccess(stream);
})
.catch(err => {
/* handle the error */
console.log("in media err");
this.getUserMediaError(err);
});
}
};
}
})
.catch(err => {
this.getUserMediaError(err);
});
}
/ *音频流和屏幕共享流的约束* /
this.config = {
iceServers: [
{
urls: ["stun:stun.l.google.com:19302"]
}
]
};
this.constraints = {
audio: { echoCancellation: true },
video: false
};
this.screenContraints = {
audio: false,
video: true
};
请让我知道我在哪里做错了。我希望并非没有可能在音频流中进行屏幕共享。