The project I received had a total of 2 pages.
1. page1: Video conference waiting room
2. page2: Video conference room
(Move in order of 1 -> 2)
However, the company asked me to put a ‘virtual background preview’ screen on both pages 1 and 2.
However, there was nothing originally on page 1.
The video track only existed on page 2.
<page 2 (Video conference room)>
At this time, the video track creation function worked normally on page 2.
So I implemented a preview screen.
const tracks = await JitsiMeetJS.createLocalTracks(
{
devices,
cameraDeviceId,
effects: backgroundEffect ? [backgroundEffect]: [],
},
);
<page 1 (Video conference waiting room)>
However, when using the “JitsiMeetJS.createLocalTracks()” function on page 1, the function did not work with the following error popping up.
TypeError: Cannot read properties of undefined (reading ‘disableAudioLevels’)
I googled this, and on page 1, “JitsiMeetJS.init();” I expected that the video track creation API would not work because I did not call the same function.
Is there any problem if I do JitsiMeetJS.init() on pages 1 and 2, respectively?
I’m worried if it’s okay to do JitsiMeetJS.init() a total of 2 times in the same project.
I called 1, 2, 3, and 5 except for number 4 in the above document. So I called the videotrack on page 1.
If I go to page 2 in this state, ‘JitsiMeetJS.init()’ is executed again.
Are there any potential problems?
// 1. The first thing you must do in order to use Jitsi Meet API is to initialize JitsiMeetJS object:
JitsiMeetJS.init();
// 2. Then you must create the connection object:
const options = Object.assign({}, config);
const connection = new JitsiMeetJS.JitsiConnection(
null,
null,
options
);
// 3. Now we can attach some listeners to the connection object and establish the server connection:
connection.addEventListener(JitsiMeetJS.events.connection.CONNECTION_ESTABLISHED, () => { console.log("CONNECTION_ESTABLISHED") });
connection.addEventListener(JitsiMeetJS.events.connection.CONNECTION_FAILED, () => { console.log("CONNECTION_FAILED") });
connection.addEventListener(JitsiMeetJS.events.connection.CONNECTION_DISCONNECTED, () => { console.log("CONNECTION_DISCONNECTED") });
connection.connect();
// 5. You also may want to get your local tracks from the camera and microphone:
newPreviewVideo();
.
.
.
// newPreviewVideon call ↓
const tracks = await JitsiMeetJS.createLocalTracks(
{
devices,
cameraDeviceId,
// effects: backgroundEffect ? [backgroundEffect] : [],
},
);
