Issue listener Jitsi API Iframe with Ionic

Developers Jitsi Meet API
#1

Hi community,
I am experiencing a problem with the Jitsi iframe listener (EventEmitter).
I have tried adding the jitsi iframe in an ionic application, below are the details:

C:\...\TestJitsi>ionic info
Ionic:

   Ionic CLI                     : 6.12.1 (C:\...\AppData\Roaming\npm\node_modules\@ionic\cli)
   Ionic Framework               : @ionic/angular 5.6.9
   @angular-devkit/build-angular : 0.1102.14
   @angular-devkit/schematics    : 11.1.4
   @angular/cli                  : 11.1.4
   @ionic/angular-toolkit        : 3.1.1

Utility:

   cordova-res : not installed
   native-run  : 1.2.2

System:

   NodeJS : v14.15.0 (C:\Program Files\nodejs\node.exe)
   npm    : 6.14.8
   OS     : Windows 10

I can see the iframe correctly and I can start the meetings. However, all instantiated listeners never trigger. Below is a snippet of the code where I define the listeners:


this.api = new JitsiMeetExternalAPI("meet.jit.si", options);

    this.api.on('log', (log: any) => {
      console.log(log);
    })

    this.api.addListener('videoConferenceLeft', () => {
      console.log("videoConferenceLeft");
    })

    this.api.addListener('videoConferenceJoined', () => {
      console.log("videoConferenceJoined")
    })

    this.api.addListener('participantJoined', (participant: any) => {
      console.log("participantJoined");
    })

    this.api.addListener('participantLeft', (participant: any) => {
      console.log("participantLeft");
    })

    this.api.addListener('readyToClose', () => {
      console.log("readyToCloses");
    })

Some additional information:

  • I tried using on() instead of addListener(), but the result did not change.

  • No errors are reported in the browser console.

Is there any known problem with the integration of Jitsi Iframe with ionic?

Any suggestions/workarounds are welcome.

Fabrizio

1 Like
#2

@FabriLog any update for this issue because I have the same issue

#3

@Esraa-Abd-Elmonem welcome to the community!

I assume you are joining a conference with 2+ users?

Since you are using Ionic, it has additional logic. You may need to capture the event and post it to the parent page (hosting the iframe) Check out:

If you are not hosting the iframe yourself (on your own server, where you can capture and post) this will probably not work.