BigBlueButton video conference

This plugin integrates a Discourse instance with BigBlueButton, an open source video conferencing tool designed for online learning. You will need to have a server running an instance of BBB to use this, see http://docs.bigbluebutton.org for more details. Compared to Zoom, Jitsi and Whereby, BigBlueButton has better browser support, in my tests it worked right away on all modern browsers, including Safari on iOS and Chrome on Android.

Screenshots


To add a video conference to a topic or post, use the “Add BigBlueButton” button from the options dropdown when composing:

Features

  • Supports multiple rooms
  • Staff users and users from a configurable group are recognized as moderators in the BBB meetings
  • Administrators can choose to embed the meeting in Discourse (via iframe) or to redirect to a full page (with separate options for mobile and desktop)
  • Shows avatars of users already in the video conference next to the button to join

Notes

I would like to thank @Stephen for pointing me to BigBlueButton and for testing and providing feedback for the early versions of the plugin.

38 Likes

Really incredible work here. So many educational establishments here using BBB, and the timing for this integration is perfect.

14 Likes

Very timely. We have been using our openmod forum as a screen for our newly established interactive webinars by only advertising the webinar URLs on private topics. Not completely watertight but we try hard to keep our forum community clean. Therefore am very interested in these developments. @pmusaraj: thanks!

4 Likes

All three volunteer groups that I’m currently assisting during this trying time have moved over to using BigBlueButton.

A big part of making that switch was this plugin. The transition from Discourse topic to the conference is totally seamless and we’re seeing none of the usual problems.

Makes my life 1000x easier not to need to play tech support.

Thanks again @pmusaraj!

9 Likes

Thanks a lot of working on this. I’ve tested and it works great.

But I bring you here some suggestions for making it simpler to use. I am assuming the use-case where a staff member of the forum it not very familiar with the internals of BigBlueButton and the only previous experience he/she has is by using BigBlueButton’s interface for creating rooms (greenlight).

With that said, here are by suggestions:

  1. Explain in original post how one creates “Start conference” buttons
    After installing it took me quite a while to figure that to add a BigBlueButton button I needed to do it though the “options” (gear icon) in the text editor. Maybe mentioning that in the instructions could avoid some confuction.

  2. Make passwords easier to create

    • buttons for generating random passwords: We all know people are lazy and they’ll probably pick a lazy password. So one might give the user an even lazier option that actually makes them more secure
    • label the passwords as “(optional)” (alternative solution) and when that is not set, generate a random password. But the user should still be informed by a note that a random password will be created instead
  3. consider hiding the passwords options under "advanced"
    I guess these options can even be hidden as most people will probably just want to create a room from within discourse and not connect it to a room created with another application

  4. not mentioning technical jargon

  • I know discourse always mentions iframe, but an average user does what that is, if the label was changed to “Show inside post” instead, it would make it more clear.
  • Meeting ID is the jargon of BigBlueButton. For most users, I guess “meeting name” would be better. And perhaps adding bellow a greyed out instruction explaining that is the “meeting ID”

The image bellow has some of the “features” explained bellow. (It’s just a mockup with no functionality)

bbb-discourse

But again, It’s already a very nice-to-have plugin especially for people working on education. So thanks again!

6 Likes

I just sent an email to BigBlueButton to see if this integration can be listed on their website Integrations - BigBlueButton.

If I have any updates I’ll post it here.

2 Likes

Thanks for the feedback @core (and the publicity), I have implemented some of the thoughtful items proposed in your post.

Password generation is now randomized and hidden from the user. (Advanced users can modify the markdown and change the passwords if they would like.) I also updated the OP with a screenshot and a description on how to access the button in the options menu.

I’m not going to make this change, I know iframe is a technical term, but in this case I don’t think changing it helps, I find it will be more confusing to use “inside post”. However… you can customize this label on your own instance, under Customize > Text, filtered by “bbb.modal”. Like in this screenshot:

5 Likes

Your solution looks perfect to me. The minimalism really makes a difference. And thanks for taking the time :slight_smile:

That’s a great compromise. Thanks!

1 Like

@pmusaraj no reply yet for adding the discourse plugin on the BBB’s website. I’ll try my luck on their mailinglist in the next days.

1 Like

@pmusaraj My request to join the mailinglist was rejected (no idea why). So I’m a bit out of options to reach out to them about the integration. I thought also about opening a GitHub issue, but that may be quite annoying as it’s not about the BBB code base.


edit: apparently this should have been posted to the bigbluebutton-users list. That’s why I must have been rejected.

1 Like

Did you follow the instructions in the description text? I’ve noted your integration and I am adding to a list of similar ones I’ve seen. My plan is to have a community page in the documentation where we can share things that we’ve made.

2 Likes

I did miss that. Sorry. But great to see it reached the contributors either way! Thanks for checking in!

Great plugin, thanks!
How do I open an existing meeting (planned by a different tool)? How do I find out the Meeting ID? Whatever I insert in this field, there’s always a new meeting being started.

This looks more like a question for BBB, but in theory, if you use the same room ID as the other tool, it should load the same meeting.

1 Like

I’ve done this once, but it was a bit complicated. You have to use the BBB API.

I’ll try to make a guide for this in a few days.

The key problem is possibly that the most commonly used tool (Greenlight) doesn’t really show that low-level information.

3 Likes

Thanks, that would be great!

1 Like

“Add BigBlueButton” to already existing conference

This plugin creates automatically a room for you when you click “Add BigBlueButton”. But you may want to use an already existing room instead (created before you had this plugin). Here are two examples of why you might want that.

  • You have already created a room - (with greenlight, for example) and want to allow people to also join from discourse

  • Also allow people to join via link - When using greenlight (the default front-end) it generates a shareable link to join the call. With this people can join via discourse or via link.

:warning: This is quite an invasive process so make really sure you understand what you are doing

Instructions

Most likely the front-end you’re using (greenlight?) doesn’t give you low-level information like the meeting ID or attendeePW (which is different than the room’s access code - I know, It’s confusing). So in order to obtain those we’ll have to use the API for BBB to list all the meeting’s information.

Note: there may be a better way to do this, but I am not aware. Just let me know if that’s the case.

Prerequisites

  • access to terminal BBB server (via ssh, for example)
  • basic python knowledge (to verify my code)
  • understanding of security risks of using the BBB API

1. Obtain BBB secret and API endpoint

Access a shell (via ssh) where the BBB server is running and run

sudo bbb-conf --secret

That will give you a URL and a Secret. They will be useful later.

:warning: Anyone with that secret can do nasty stuff your server! So keep it safe.

2. Create python3 script to obtain the Meeting’s information

Bellow is a simple python 3 script that takes your URL and Secret (given in step 1.) and generates the API to get the information from the meetings:

:warning: Don’t just paste random scripts you find on the internet (this one included!). Check it and see if makes sense and if needed check the documentation for the API.

import hashlib
from urllib.parse import urljoin

# Insert your variables here
base_url = "PASTE_HERE_YOUR_URL" + "api/"
secret = "PASTE_HERE_YOUR_SECRET"

# generate the security checksum
plaintext = "getMeetings" + secret
sha1 = hashlib.sha1()
sha1.update(plaintext.encode('utf-8'))
checksum = sha1.hexdigest()

# obtain the API url for listing meetings' information
url = urljoin(base_url, "getMeetings?checksum=" + checksum)
print("open the following URL to see the meeting's information")
print(url)

replace PASTE_HERE_YOUR_URL with the API URL obtained earlier and PASTE_HERE_YOUR_SECRET with the secret and then run the script.

After this it should print a url like https://example.com/bigbluebutton/api/getMeetings?checksum=20e928e8928e8e9f919928e829d999df82882818

:warning: Anyone with that URL can do nasty stuff!

They can see all the meetings that are going on, how may users are in each as well as obtaining the credentials to join it.

3. Open the URL

Open it in private browsing mode to make sure the URL isn’t stored in the browser history due to the above warning.

Just start the meeting you pretend to add and refresh that page with the API URL. Then you should see something like

<response>
<returncode>SUCCESS</returncode>
<meetings>
<meeting>
<meetingName>Your room name</meetingName>
<meetingID>XXXXXXXXXXXXXXXXXXXXXXXXXXX</meetingID>
...
<attendeePW>YYYYYYY</attendeePW>
<moderatorPW>ZZZZZZZ</moderatorPW>
...

Just look for the lines bellow the meeting you want and take:

  • meetingID
  • attendeePW
  • moderatorPW

After you obtain these, erase all the files and close all the tabs with access to the API.
We don’t want any security incidents!

4. “add BigBlueButton” to your post

Instead of adding via the regular “add BigBlueButton” interface, just paste the following onto your post:

[wrap=discourse-bbb meetingID="XXXXX" attendeePW="YYYYY" moderatorPW="ZZZZZ"  mobileIframe="false" desktopIframe="false"][/wrap] 

And replace with what you obtained in step 3.

  • XXXXX with the content of meetingID
  • YYYYY with the content of atendeePW
  • ZZZZZZ with the content of moderatorPW

And then save the post.

6. It should be working now \o/

You should now be able to join both via discourse and via the other front-end you were using. If it was greenlight, you can also join via link now too.

3 Likes

Hi there,

Great job with the plugin, we absolutely love it!

I’ve noticed a few things that still need to be worked on so I am documenting them here:

  1. Screensharing doesn’t work
    (There’s no popup to ask for permissions, the process just fails)

  2. When you iframe the session, you don’t have the ability to record the meeting

I was wondering if there’s anywhere to report these? The GitHub repo seems to have issues disabled

Screen sharing does work, we use it extensively. Chrome doesn’t like screen sharing to an iFrame for privacy/security.

Chrome doesn’t like screen sharing to an iFrame for privacy/security.

I’m guessing that’s the reason it doesn’t work in Firefox either…