Connecting Flutter with WebRTC library

Install & Config
#1

Hi

I am building flutter app. So far there is no jitsi library for flutter, so I found webRtc library, which should solve this problem. Implementing it is not that simple, because there is hardly any tutorial on how to connect from webrtc library to jitsi. The library I found is flutter-webrtc, there is also an example app provided. I quite understand how it works, but there connection is done by WebSockets from the beginning. There is no possibility to enter the https address of the room and make a connection.
Simply put, I want to make a connection using the webRtc library, having only https address of the room.
If there is sheme in websocket address, I could modify initial address to the websocket one.
Code example would be really appreciated

1 Like
#2

Hey there and welcome to our community!

If you want to connect to a Jitsi room you need to implement the Jitsi signaling protocol: XMPP. We use lib-jitsi-meet which is a library abstracting developers from XMPP itself and from stream management. You’d basically need to reimplement it in Flutter.

#3

This does not sound nice, so I decided to try and use Platform Views. I started from the android side. I have to make a View from Activity (JitsiMeetActivity.java). There are some calls to methods in Services or Modules, which are package private. This means that I have to fork this library, to make it work, or is there some class that have all of the most important method calls in it ? Still, I do not get it, why JitsiMeetView should be an alternative to already made activity, but most of the callbacks used in activity are not possible to use elsewhere.

#4

I don’t understand what you mean. Can you please give an example? What method are you trying to use and to accomplish what exactly?

#5

@saghul To use PlatformViews I need to return an android View. Activity is not a View, so I cannot return it. I can obtain callbacks like activity lifecycle. So I thought that I will rewrite the activity provided by the SDK, as a view, but I cannot call some of the methods because they are package private.

For example in onDestroy() we have

if (AudioModeModule.useConnectionService()) {
ConnectionService.abortConnections();
}

both of those methods are package private so I cannot use them. And there are more.

Then I tried to simple return JitsiMeetView omitting all of the other calls, to see if it runs. When I tried to return JitsiMeetView, an exception was thrown that the provided context to the constructor is not an activity which implements JitsiMeetActivityInterface. This makes another problem because I do not have any activity file that I can modify to implement it. I can only obtain an activity which is returned from one of the flutter objects in kotlin code.

I hope it is a bit understandable, if not, let me know and I will try to elaborate more.

#6

JitsiMeetView must be atttached to an Android Activity. If you cannot do this with Flutter, than there is no way for you to use the SDK, sorry about that, but there is nothing we can do, since React Native itself reliess on it.

#7

What I meant, is that I can obtain activity, because one flutter object returns it, but I do not have file Activity which I can modify. As I saw in the error log, the context passed to the JitsiMeetView should be one from Activity which implements JitsiMeetActivityInterface, which I cannot provide, because I, unfortunately, do not have access to this file, so only plain Activity can be passed.

#8

That interface is required for things to work, if you cannot provide it, there is no way to integrate it, at least the way you are currently trying to.

Isn’t there a way to launch an activity from within Flutter? That way you could keep all the Jitsi code contained there and when that activity is done yours would be resumed.

#9

There is a possibility to start an activity from flutter, and I will try it. I wanted to do it differently, so implementing it for both android and ios would be much simpler. I wonder if something similar can be achieved on ios, I have no experience with it, so there will be another challenge.

#10

I’d say the quivalent would be to implement a ViewController in ObjC / Swift and present it. I’m assuming you are able to present a native viewcontrollerr from Flutter here…

#11

We have managed to implement it using PlatformViews, but we want to give webRtc a shot. As you mentioned in the first comment, we need to implement xmpp. I am trying to go through lib-jitsi-meet it and understand it. I have trouble to find a place where all the connection parameters for RTC are obtained like peer and seed Id. Can you point me in some direction ?

#12

Hi we are using jitsi-meet for web and Flutter,
For web i can customise in react and move libs to server,
But for flutter how its working and where i should change codes and how to deploy it?

#13

Hi, could you please tell me how you implemented it using PlatformViews?

Mostly interested in how you beat JitsiMeetActivityInterface requirement and other essential callbacks.

Thanks in advance.

#14

I think now you can find a library on pub.dev for jitsi, that uses PlatformViews. It would be easier that implementing it yourself

#15

There’s one, but it’s based on launching a separate activity. I need to draw some custom flutter ui over jitsi, so PlatformViews are my only option.

I got to the point of making my MainActivity (flutter) implement JitsiMeetActivityInterface. But this seems hacky.

#16

With drawing the custom UI in flutter is some problem. What I mean is that, I have the official Jitsi UI in my implementation, so covering it with flutter UI does not seem like a good option. Of course it depends on what you need to do. I wanted to change the conversation UI, but it can be done in jitsi library not in flutter. That is the reason, why I started rewritting lib-jitsi-meet to dart, so that I can make my own UI. If you want to draw something on top I can check my code and I will let you know how I did it.

#17

can u give me clear idea. how to change flutter library.

#18

I do not understand your question. What do you want to change and in which flutter library ?

#19

I am using jitsi-meet flutter library and it is working fine. Bu t I do want to remove the options like “kickout and private message”. Is it possible to modify from client side using jitsi-meet flutter library in flutter ?

#20

I do not think so. This library is like a ‘wrapper’ around React Native code, so you should modify official JitsiMeet library, and then fork the flutter one and there change dependencies to your modified versions.