嗨,我正在用twilio video js sdk开发React应用。 我可以将本地视频放到div上,但远程轨道无法正常工作。 我正在获取与参与者相关的事件,但远程跟踪未在DOM中显示
connect(this.props.twilio_token, {
audio: true,
video: { width: 640 },
name: "my-new-room",
bandwidthProfile: {
video: {
mode: "grid",
maxTracks: 2,
renderDimensions: {
high: { height: 1080, width: 1920 },
standard: { height: 720, width: 1280 },
low: { height: 176, width: 144 },
},
},
},
}).then(
(room) => {
console.log(`Connected to Room: ${room.name}`);
room.on("participantConnected", (participant) => {
console.log(
`Participant "${participant.identity}" connected`
);
participant.tracks.forEach((publication) => {
if (publication.isSubscribed) {
const track = publication.track;
document
.getElementById("remote-media-div")
.appendChild(track.attach());
}
});
participant.on("trackSubscribed", (track) => {
document
.getElementById("remote-media-div")
.appendChild(track.attach());
});
});
room.participants.forEach((participant) => {
participant.tracks.forEach((publication) => {
if (publication.track) {
document
.getElementById("remote-media-div")
.appendChild(publication.track.attach());
}
});
participant.on("trackSubscribed", (track) => {
document
.getElementById("remote-media-div")
.appendChild(track.attach());
});
});
},
(error) => {
console.error(`Unable to connect to Room: ${error.message}`);
}
);