Live streaming setup: Difference between revisions

Revision as of 21:25, 11 October 2020

Quick notes on the livestreaming setup we use on https://live.hackersanddesigners.nl

Server

To start the server you need access to the 'livestream' user account.

Log in to the server, this should work without a password. If this doesn't work ask Andre to add your ssh key to the user account.

ssh livestream@hackersanddesigners.nl

Start the server:

cd /var/www/live
npm run start

Immediately after starting the script prints the stream key in the terminal window:

> hd-x-thehmm@1.0.0 start /var/www/live > node server.js Found an existing stream! Fetching updated data. Your app is listening on port 4000 HERE ARE YOUR STREAM DETAILS, KEEP THEM SECRET! Stream Key: ***xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx***

Copy the Stream Key.

MUX

The backend we use is powered by [mux.com]. The recordings get stored there. If you need them, ask Heerko or André for the password.

OBS

Download [OBS]
Go to Settings > Stream

* Service: Custom
* Server: rtmps://global-live.mux.com:443/app
* Stream key: paste the key you copied from the terminal.

Setting up the scenes in OBS pretty clear, and there's plenty tutorials out there, so I am skipping that :)

OBS Ninja

To get a speaker in the stream we use OBS Ninja: https://obs.ninja/

Click on 'Create reusable invite', use the speaker's name a the name and click the 'generate the invite link' button.

The next screen gives you two links: 1. The link you give to the speaker to connect to. 2. The OBS browser source link

Save both. Send the speaker link to the speaker.

On Mac

The browser source in OBS can't capture the OBS.Ninja audio. As a work around we use the OBS.Ninja app. There's a really good explanation on how to set it up on their github: https://github.com/steveseguin/electroncapture

@@ Line 15: / Line 15: @@
 <code>
-> hd-x-thehmm@1.0.0 start /var/www/live
+> hd-x-thehmm@1.0.0 start /var/www/live<br />
-> node server.js
+> node server.js<br />
+<br />
-Found an existing stream! Fetching updated data.
+Found an existing stream! Fetching updated data.<br />
-Your app is listening on port 4000
+Your app is listening on port 4000<br />
-HERE ARE YOUR STREAM DETAILS, KEEP THEM SECRET!
+HERE ARE YOUR STREAM DETAILS, KEEP THEM SECRET!<br />
-Stream Key: ***xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx***
+Stream Key: ***xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx***<br />
 </code>
@@ Line 28: / Line 28: @@
 ==MUX==
-The backend we use is powered by [[https://mux.com mux.com]]. Ask Heerko or André for the password.
+The backend we use is powered by [[https://mux.com mux.com]]. The recordings get stored there. If you need them, ask Heerko or André for the password.
-<!--
-To setup our stream we need a stream key. You can get that key by going to Video > Livestreams in the left sidebar. There's two streams there. One is a test stream (has a notice at the top), good for testing (FREE!) but only for a limited time. The other one is the stream we use for broadcast. Find the right one, click '''[Show stream key]''' and copy the key.
--->
 ==OBS==