You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

161 lines
5.8 KiB

2 months ago
# mediasoup-demo v3
3 months ago
2 months ago
A demo application of [mediasoup](https://mediasoup.org) **v3**.
Try it online at https://v3demo.mediasoup.org
## Resources
* mediasoup website and documentation: [mediasoup.org](https://mediasoup.org)
* mediasoup support forum: [mediasoup.discourse.group](https://mediasoup.discourse.group)
## Configuration via query parameters
By adding query parameters into the URL you can set certain settings of the application:
| Parameter | Type | Description | Default Value |
| ------------------ | ------- | -------------------- | ------------- |
| `roomId` | String | Id of the room | Autogenerated |
| `displayName` | String | Display name of your participant | Autogenerated |
| `handlerName` | String | Handler name of the mediasoup-client `Device` instance | Autodetected |
| `forceTcp` | Boolean | Force RTC (audio/video/datachannel) over TCP instead of UDP | `false` |
| `produce` | Boolean | Enable sending of audio/video | `true` |
| `consume` | Boolean | Enable reception of audio/video | `true` |
| `datachannel` | Boolean | Enable DataChannels | `true` |
| `forceVP8` | Boolean | Force VP8 codec for webcam and screen sharing | `false` |
| `forceH264` | Boolean | Force H264 codec for webcam and screen sharing | `false` |
| `forceVP9` | Boolean | Force VP9 codec for webcam and screen sharing | `false` |
| `enableWebcamLayers` | Boolean | Enable simulcast or SVC for webcam | `true` |
| `enableSharingLayers` | Boolean | Enable simulcast or SVC for screen sharing | `true` |
| `webcamScalabilityMode` | String | `scalabilityMode` for webcam | 'L1T3' for VP8/H264 (in each simulcast encoding), 'L3T3_KEY' for VP9 |
| `sharingScalabilityMode` | String | `scalabilityMode` for screen sharing | 'L1T3' for VP8/H264 (in each simulcast encoding), 'L3T3' for VP9 |
| `numSimulcastStreams` | Number | Number of streams for simulcast in webcam and screen sharing | 3 |
| `info` | Boolean | Display detailed information about media transmission | `false` |
| `faceDetection` | Boolean | Run face detection | `false` |
| `externalVideo` | Boolean | Send an external video instead of local webcam | `false` |
| `e2eKey` | String | Key for media E2E encryption/decryption (just works with some OPUS and VP8 codecs) | |
| `consumerReplicas` | Number | Create artificial replicas of yourself and receive their audio and video (not displayed in the UI) | 0 |
## Installation
* Clone the project:
```bash
$ git clone https://github.com/versatica/mediasoup-demo.git
$ cd mediasoup-demo
$ git checkout v3
```
* Ensure you have installed the [dependencies](https://mediasoup.org/documentation/v3/mediasoup/installation/#requirements) required by mediasoup to build.
* Set up the mediasoup-demo server:
```bash
$ cd server
$ npm install
```
* Copy `config.example.js` as `config.js` and customize it for your scenario:
```bash
$ cp config.example.js config.js
```
**NOTE:** To be perfectly clear, "customize it for your scenario" is not something "optional". If you don't set proper values in `config.js` the application **won't work**. You must configure a tls certificate.
* Set up the mediasoup-demo browser app:
```bash
$ cd app
# For node 16
$ npm install
# For node 18, use legacy peer dependencies
$ npm install --legacy-peer-deps
```
## Run it locally
* Run the Node.js server application in a terminal:
```bash
$ cd server
$ npm start
```
* In a different terminal build and run the browser application:
```bash
$ cd app
$ npm start
```
If you configured a self-signed tls certificate, and receive wss: connection errors, open the wss: url with https: protocol to accept the cert and allow wss: connections in your browser.
* Enjoy.
## Deploy it in a server
* Globally install `gulp-cli` NPM module (may need `sudo`):
```bash
$ npm install -g gulp-cli
```
* Build the production ready browser application:
```bash
$ cd app
$ gulp dist
```
* Upload the entire `server` folder to your server and make your web server (Apache, Nginx, etc) expose the `server/public` folder.
* Edit your `server/config.js` with appropriate settings (listening IP/port, logging options, **valid** TLS certificate, etc).
* Within your server, run the Node.js application by setting the `DEBUG` environment variable according to your needs ([more info](https://mediasoup.org/documentation/v3/mediasoup/debugging/)):
```bash
$ DEBUG="*mediasoup* *ERROR* *WARN*" node server.js
```
* If you wish to run it as daemon/service you can use [pm2](https://www.npmjs.com/package/pm2) process manager. Or you can dockerize it among other options.
* The Node.js application exposes an interactive terminal. When running as daemon (in background) the host administrator can connect to it by entering into the `server` folder and running:
```bash
$ npm run connect
```
## Run mediasoup server with Docker
* Required environment variables: [server/DOCKER.md](server/DOCKER.md).
* Build the Docker image: [server/docker/build.sh](server/docker/build.sh).
* Run the Docker image: [server/docker/run.sh](server/docker/run.sh).
```
$ cd server
$ docker/build.sh
$ MEDIASOUP_ANNOUNCED_IP=192.168.1.34 ./docker/run.sh
```
#### Considerations for [config.js](server/config.example.js)
* Make sure [https.listenIp](server/config.example.js#L20) is set to `0.0.0.0`.
* Make sure [TLS certificates](server/config.example.js#L24) reside in `server/certs` directory with names `fullchain.pem` and `privkey.pem`.
* The default mediasoup port range is just 2000-2020, which is not suitable for production. You should increase it, however you should then run the container in `network="host"` mode.
## Authors
* Iñaki Baz Castillo [[website](https://inakibaz.me)|[github](https://github.com/ibc/)]
* José Luis Millán Villegas [[github](https://github.com/jmillan/)]
## License
MIT