我正在捕获用户的屏幕,并将该轨迹发布到房间的本地参与者对象,但是供稿继续显示用户的摄像机。如果我将房间对象记录到控制台,它不会显示多条轨道。在尝试发布用户的屏幕轨迹之前,是否需要取消发布用户的摄像机轨迹?我提供了共享屏幕方法,供您查看。预先感谢您提供的任何帮助!
我已经遍历了这些参考文献,并且代码似乎与此处编写的代码非常相似,但遗憾的是它仍然无法正常工作
-https://www.twilio.com/blog/screen-sharing-javascript-twilio-programmable-video
-https://www.twilio.com/blog/2018/01/screen-sharing-twilio-video.html
export default function useScreenShareToggle() {
const { room, onError } = useVideoContext();
const [isSharing, setIsSharing] = useState(false);
const stopScreenShareRef = useRef<() => void>(null!);
const shareScreen = useCallback(() => {
navigator.mediaDevices
.getDisplayMedia({
audio: false,
video: {
frameRate: 10,
height: 1080,
width: 1920,
},
})
.then(stream => {
const track = stream.getTracks()[0];
// All video tracks are published with 'low' priority. This works because the video
// track that is displayed in the 'MainParticipant' component will have it's priority
// set to 'high' via track.setPriority()
room.localParticipant
.publishTrack(track, {
name: 'screen', // Tracks can be named to easily find them later
priority: 'low', // Priority is set to high by the subscriber when the video track is
rendered
} as MediaStreamTrackPublishOptions)
.then(trackPublication => {
stopScreenShareRef.current = () => {
room.localParticipant.unpublishTrack(track);
// TODO: remove this if the SDK is updated to emit this event
room.localParticipant.emit('trackUnpublished', trackPublication);
track.stop();
setIsSharing(false);
};
track.onended = stopScreenShareRef.current;
setIsSharing(true);
})
.catch(onError);
})
.catch(error => {
// Don't display an error if the user closes the screen share dialog
if (error.name !== 'AbortError' && error.name !== 'NotAllowedError') {
onError(error);
}
});
}, [room, onError]);
const toggleScreenShare = useCallback(() => {
!isSharing ? shareScreen() : stopScreenShareRef.current();
}, [isSharing, shareScreen, stopScreenShareRef]);
return [isSharing, toggleScreenShare] as const;
}
P.s。我没有编写此代码,因此可能存在一些我忽略的细微行为问题。如果某些事情似乎是明显的疏忽,那么我只是有机会错过了,而且这不是故意的。