A Simple Video Chat Demo based on React and WebRTC
The project root contains scripts to cover both the frontend and backend at the same time. To install, just type:
$ npm install
Now you can simply start the signalling server and the frontend app by typing:
$ npm run dev
After a short while, the video chat should be available at: http://localhost:3000.
There are two simple Dockerfiles included in the project. You can build both the frontend and backend images by running:
$ npm run docker:build
The configuration of the backend is done through ENVIRONMENT variables:
Name | Description | Default |
---|---|---|
LISTEN_PORT | The port number for the socket.io signaling server | 4999 |
TURN_SERVERS | A comma-separated list of TURN servers ("turn:server.com") | None |
TURN_SECRET | The auth secret used for accessing the TURN server via TURN REST API | None |
STUN_SERVERS | A comma-separated list of STUN servers ("stun:server.com") | None |
The configuration of the frontend is (currently) done by volume-sharing the env.js file to: /usr/local/apache2/htdocs/env.js
into the running frontend container.
Start the coturn docker image instrumentisto/coturn with the following parameters:
services:
coturn:
image: instrumentisto/coturn
network_mode: host
volumes:
- "./coturn:/var/lib/coturn"
command: ["-a", "-f", "--realm=videochat", "--log-file=stdout", "--min-port=49160", "--max-port=49200", "--external-ip=$$(detect-external-ip)", "--use-auth-secret", "--static-auth-secret=the-turn-secret-see-above"]
- Configure the firewall to open up UDP ports
--min-port
to--max-port
(49160-49200 in the example above.) - The
--static-auth-secret
needs to be the same as theTURN_SECRET
configured for the signaling server.