Whereby Host & User Permissions with Bubble.io

Adding Host Privileges to Whereby Meetings in Bubble

In our mini series looking at how to add the whereby embedded video conferencing into your Bubble app, we got as far as creating a meeting using the API and then sending the user or ourselves through to a page where we could then engage and enter into that meeting. But I missed a really cool feature that they've got available which is user roles and meeting permissions. For example, you can have someone as a role of host and then where you do that is by giving them a special URL which you would only share with the host. So let me show you how we can do that really easily.

Updating the JSON in Bubble's API Connector

I'm gonna just go in to my Bubble app and go to plugins and just by adding this additional line into the JSON we can say that when we create a meeting we expect to get back a host URL and that's the special URL that we only want our hosts to be able to access. So if I initialize this we get back another field which is our host URL and you'll notice it contains a room key. This is to add security to it. Anyone who has the host room URL can access the host features, but participants we'd only want them to access the room URL.

Updating the Workflow

Let's add this into our workflow by going ahead and adding in a field for host URL and saying the result of step one is the Host URL there is. So that's saving it into the database and allowing us to retrieve it. But we're going to want to apply some privacy rules here because privacy rules are the only proper way of securing data in your Bubble app.

Setting Up Privacy Rules

Let's have a look at data privacy and then meetings. So at the moment we're saying that if the current user creates a meeting they can access all fields so they can access the host URL and the participant URL. But if we just want to be able to share a link to the page on our site where the meetings taking place then we want to also allow anyone so public.

If I by taking this box this field is now publicly accessible. Now you're gonna want to consider that and make sure and run all other sorts of security checks on your Bubble app. For example, is it okay that someone with the right technical skills could basically access all of these public URLs in your Bubble app? Just bear that in mind. But importantly in this instance, we don't want this box ticked because the host URL should only be accessible to this user.

Making the Embed More Dynamic

One other thing that we should change then is that in meetings we want to update our embed. Instead of just saying current pages meeting URL we need to make this a little bit more dynamic so that if the person visiting this page is the meetings creator, they get those hosts privileges. So we'll just say instead current pages meetings creator is current user. Form after those text. So if they are the current user then we can print the current meetings Host URL and if they're not current meetings URL because that's for participants.

Now just remember that privacy rules are the only proper ways to protect this data. It's not just good enough to ignore the privacy rules and just say well if they are the creator show this URL otherwise show this URL because we actually don't want this field to be accessible at all to someone who isn't a creator.

Demonstrating the Feature

Let's go ahead and demo that and I'm gonna do that by first of all creating a user because at the moment the database is empty no users and no meetings. So let's create a user and we'll just say test@example.com. And now going back to dashboard and then back into data and perhaps just giving us a refresh I'm going to run as that user because I want anything that I create now to have that current user as the creator.

So let's create a meeting. We'll call this planet no code test. Select the date in the future save. Okay, now if I click join then if I go to just to demonstrate what's gone on here we've created a meeting. We have the host URL if I click here, we have the host URL we have the main URL for participants and the creator is linked to the account that I just created.

If I go back to the demo and join the meeting, okay, I now have got access to a few more features because I am the host. And if I go into inspect we can see exactly why that's happening because go to HTML current users meetings creator is currently so current pages meetings creator is current user. The answer is yes, and so we're getting the host URL. But if the answer was no we would get the participant URL.

Conclusion

So there you go, that's how you can add in host privileges and user roles into your whereby meetings that you're embedding in your Bubble app. You can go in all sorts of directions of this the possibilities are endless. Because whereby allows you to basically create a no code video conferencing app with Bubble.