Jitsi Video Conference Integration

Ask the Community Get Answers
1

I would like to integrate Jitsi as a Video Conference tool on my platform on Knack.
Has anyone integrated using the API or Javascript?

This is the code they provide for the integration.

<script src='https://meet.jit.si/external_api.js'></script>
...
const domain = 'meet.jit.si';
const options = {
    roomName: 'PickAnAppropriateMeetingNameHere',
    width: 700,
    height: 700,
    parentNode: document.querySelector('#meet')
};
const api = new JitsiMeetExternalAPI(domain, options);

I have written the following in Knack > Javascript section:

// Jitsi Integration
LazyLoad.js([‘https://meet.jit.si/external_api.js’], function () {
console.log(‘I have loaded Library’);
});

const domain = ‘meet.jit.si’;
const options = {
roomName: ‘myroom’,
width: 700,
height: 700,
parentNode: document.querySelector(’#meet’)
};

const api = new JitsiMeetExternalAPI(domain, options);

The error I get in Console is the following:

Uncaught ReferenceError: JitsiMeetExternalAPI is not defined

Thank you in advance if anyone is able to help me!

2

Hi Frabcesco,

Try below code

LazyLoad.js([‘https://meet.jit.si/external_api.js’], function () {
console.log(‘I have loaded Library’);
const domain = ‘meet.jit.si’;
const options = {
roomName: ‘myroom’,
width: 700,
height: 700,
parentNode: document.querySelector(’#meet’)
};

const api = new JitsiMeetExternalAPI(domain, options);

});

Regards,
Sunny Singla

3

Thanks @Sunny_Singla, really appreciate your help!

I have tried, but now it gives me a different error, see img below:

Console
Console844×174 13.5 KB

By the way, should we be able to load this correctly, how would I recall the tool on one of the knack pages?

Should I create a Rich Text and write an HTML code (if yes, what should I write?) I am having hard time to understand their API integration manual to be frank.

I used to use a video recording tool, but it was clear that I have to recall the object with a similar line

In this case, I do not understand what to do :zipper_mouth_face:

Thanks for trying to help!
Regards,
Francesco

4

Look like you didn’t add a token.

There are multiple ways. you can use rich text or you can add variable Like var jsLoaded=0

on LazyLoad.js([‘https://meet.jit.si/external_api.js’], function () { jsLoaded=1});

then on form load check if that variable is 1 then add another code3 otherwise wait for 1 sec and then load the code do this in loop.

Regards,
Sunny Singla