Hi I am making a web application in vue.js using openvidu.
I’m having trouble making a recording using a custom layout.
I would like to record without closing the session, changing the positions of the participants in some cases.
for this i
- Adjusted component placement in a custom layout using signaling.
→ The layout was changed in the debugging site, but it was not adjusted in the recording file.
// index.html
session.on('signal:test', (e) => {
// test 1
var video = document.getElementById(`remote-video-${e.from.stream.streamId}`).cloneNode()
document.getElementById(`remote-video-${e.from.stream.streamId}`).remove()
document.getElementById('big-video-div').appendChild(video)
//test2
var sub = subscribers.get(e.from.stream.streamId)
var sub = subscribers.get(e.from.stream.streamId)
sub.createVideoElement('big-video-div', "APPEND")
//test3
var sub = subscribers.get(e.from.stream.streamId)
console.log(sub)
console.log(subscribers)
session.unsubscribe(sub)
.then(() => {
var subscriber = session.subscribe(e.from.stream, 'big-video-div')
subscribers.set(e.from.stream.streamId, subscriber)
})
});
- Received user information to be changed by signaling, and subscribed by receiving streamCreated again through publish and unpublish.
→ In the debugging site, the layout was changed, but in the recording file, it was not adjusted, and there was a problem that it was not displayed properly on the user’s screen.
this.session.unpublish(this.publisher);
this.session.publish(this.publisher);
this.startRecording()
// index.html
session.on("streamCreated", (event) => {
console.log("recorder and nowStreamer")
var now = JSON.parse(event.stream.connection.data).clientData
console.log(recorder)
console.log(now)
if(now === recorder || JSON.parse(stream.connection.data).isEE === "Y"){
session.subscribe(event.stream, 'big-video-div')
} else {
session.subscribe(event.stream, 'smaill-video-div')
}
});
- Disconnect the user with session.disconnect and reconnect.
→ There is a problem that the recording is done, but it is not displayed properly on the user’s screen.
this.session.disconnect()
const newOv = new OpenVidu();
const ovInitSession = this.OV.initSession();
this.getToken(this.mySessionId).then((token) => { ...
// index.html
session.on("streamCreated", (event) => {
console.log("recorder and nowStreamer")
var now = JSON.parse(event.stream.connection.data).clientData
console.log(recorder)
console.log(now)
if(now === recorder || JSON.parse(stream.connection.data).isEE === "Y"){
session.subscribe(event.stream, 'big-video-div')
} else {
session.subscribe(event.stream, 'smaill-video-div')
}
});
why not?? Is there any other way???
If there is no way, I’m going to do a way to record on the client. But is this possible in vue js??
Do you have a vue js or javascript reference?
I will wait for your reply thank you