Day28 [实作] 一对一视讯通话(8): Docker compose 整合 TURN Server

前面的实作中，我们都是使用 google 提供的 STUN server，在 後疫情时代的 WebRTC 微学习系列 第 19 篇 中我们使用 coturn 来部署并测试了 TURN server，今天我们要把他加入我们的实作中，并使用 docker compose 来整合部署。

const configuration = {
  iceServers: [
    {
      urls: 'stun:stun.l.google.com:19302',
    },
  ],
}
peerConn = new RTCPeerConnection(configuration)

文件配置

首先在 1-on-1-webrtc 资料夹中先建立一个singaling的资料夹并把所有档案移进去

1-on-1-webrtc
└── signaling
    ├── Dockerfile
    ├── README.md
    ├── cert
    │   ├── cert.pem
    │   └── key.pem
    ├── package-lock.json
    ├── package.json
    ├── public
    │   ├── index.html
    │   └── js
    │       └── main.js
    └── server.js

接着建立 一个 turn 资料夹，并在资料夹内建立Dockerfile

❯ mkdir turn
❯ cd turn
❯ touch Dockerfile
❯ cd ..
❯ tree -I 'node_modules' .
1-on-1-webrtc
├── signaling
│   ├── Dockerfile
│   ├── README.md
│   ├── cert
│   │   ├── cert.pem
│   │   └── key.pem
│   ├── package-lock.json
│   ├── package.json
│   ├── public
│   │   ├── index.html
│   │   └── js
│   │       └── main.js
│   └── server.js
└── turn
    └── Dockerfile

5 directories, 10 files

在 turn/Dockerfile 中，写入 coturn 的配置

FROM ubuntu:20.04

# Setup turn server

RUN apt-get update -y
RUN apt-get install coturn -y

EXPOSE 3478/tcp
EXPOSE 3478/udp

CMD turnserver -a -o -v -n --no-dtls --no-tls -u username:password -r testRealm & sleep infinity 

再来就是建立 docker-compose.yml 文件

❯ touch docker-compose.yml
❯ tree -I 'node_modules' .
1-on-1-webrtc
├── docker-compose.yml
├── signaling
│   ├── Dockerfile
│   ├── README.md
│   ├── cert
│   │   ├── cert.pem
│   │   └── key.pem
│   ├── package-lock.json
│   ├── package.json
│   ├── public
│   │   ├── index.html
│   │   └── js
│   │       └── main.js
│   └── server.js
└── turn
    └── Dockerfile

5 directories, 11 files

Docker compose

version: '3'

services:

  turn-server:
    build: ./turn/
    container_name: turn-server
    image: turn
    ports:
      - "3478:3478/tcp"
      - "3478:3478/udp"
    networks:
      - webrtc

  signaling-server:
    build: ./signaling/
    container_name: signaling-server
    image: signaling
    ports:
      - "8088:8088"
    networks:
      - webrtc

networks:
    webrtc:

修改程序码

在 main.js 中建立三个常数，URL 可以填写主机的ip

const TURN_SERVER_URL = '0.0.0.0:3478'
const TURN_SERVER_USERNAME = 'username'
const TURN_SERVER_CREDENTIAL = 'password'

将 google 的 STUN server 替换为

const configuration = {
  iceServers: [
    {
      urls: 'stun:' + TURN_SERVER_URL + '?transport=tcp',
      username: TURN_SERVER_USERNAME,
      credential: TURN_SERVER_CREDENTIAL,
    },
    {
      urls: 'stun:' + TURN_SERVER_URL + '?transport=udp',
      username: TURN_SERVER_USERNAME,
      credential: TURN_SERVER_CREDENTIAL,
    },
    {
      urls: 'turn:' + TURN_SERVER_URL + '?transport=tcp',
      username: TURN_SERVER_USERNAME,
      credential: TURN_SERVER_CREDENTIAL,
    },
    {
      urls: 'turn:' + TURN_SERVER_URL + '?transport=udp',
      username: TURN_SERVER_USERNAME,
      credential: TURN_SERVER_CREDENTIAL,
    },
  ],
}
peerConn = new RTCPeerConnection(configuration)

启动 docker-compose

docker-compose up -d

打开浏览器 https://localhost:8088/ 测试看看

从 Github 抓下来测试

完整内容可以参考 Github

❯ git clone https://github.com/tc3oliver/1-on-1-webrtc.git
❯ cd 1-on-1-webrtc
❯ git checkout docker-compose
❯ docker-compose up -d