[OpenVidu]EC2 + React + Openvidu 적용기

Openvidu를 이용해 webRTC를 구현하기 위해선 일단 websocket 연결을 위해 Frontend에 https가 적용되어야 한다.

 

Nginx + Springboot에 Https 적용하기(nginx, springboot, gradle)

ubuntu 20.04 LTS

기존 openvidu 관련 docker image가 존재한다면 모두 삭제해 주고 시작해야한다.

$ docker ps -a

#openvidu, kurento media server등의 컨테이너가 존재한다면 삭제한다.
$ docker rm <ID or Name>

#컨테이너 모두 삭제를 원할 경우
$ docker rm $(docker ps -a)

$ docker images

# 이미지도 삭제
$ docker rmi <ID or IMAGE>

# 이미지 전체 삭제를 원할 경우
$docker rmi $(docker images)

openvidu On premises 설치 (공식문서)

# 관리자 권한
$ sudo su

# openvidu가 설치되는 경로
$ cd /opt

# openvidu on promises 설치
$ curl https://s3-eu-west-1.amazonaws.com/aws.openvidu.io/install_openvidu_latest.sh | bash

$ exit

$ cd openvidu

openvidu 설정 변경

인증서 타입의 기본값은 selfsigned이다.

만약 certbot을 이용해 인증서를 발급받았다면 설정을 변경 해 주어야 한다.

# /opt/openvidu

$ sudo vi .env

# OpenVidu configuration
# ----------------------
# Documentation: https://docs.openvidu.io/en/stable/reference-docs/openvidu-config/

# NOTE: This file doesn't need to quote assignment values, like most shells do.
# All values are stored as-is, even if they contain spaces, so don't quote them.

# Domain name. If you do not have one, the public IP of the machine.
# For example: 198.51.100.1, or openvidu.example.com

# 본인 서버의 도메인(example.com) 또는
# $ curl ifconfig.me 커맨드를 실행한 결과로 얻는 ip를 기입한다.
# openvidu 서버가 여기 작성한 도메인으로 실행된다.
DOMAIN_OR_PUBLIC_IP=<도메인 또는 public IP>

# OpenVidu SECRET used for apps to connect to OpenVidu server and users to access to OpenVidu Dashboard

# 아마도 아무거나 작성하면 된다.
OPENVIDU_SECRET=MY_SECRET

# Certificate type:
# - selfsigned:  Self signed certificate. Not recommended for production use.
#                Users will see an ERROR when connected to web page.
# - owncert:     Valid certificate purchased in a Internet services company.
#                Please put the certificates files inside folder ./owncert
#                with names certificate.key and certificate.cert
# - letsencrypt: Generate a new certificate using letsencrypt. Please set the
#                required contact email for Let's Encrypt in LETSENCRYPT_EMAIL
#                variable.

# 인증서를 cetbot으로 발급받았다면 letsencrypt로 변경
CERTIFICATE_TYPE=letsencrypt

# If CERTIFICATE_TYPE=letsencrypt, you need to configure a valid email for notifications

# 만약 인증서 타입이 letsencrypt라면 이메일 설정.
LETSENCRYPT_EMAIL=user@example.com


# Proxy configuration
# If you want to change the ports on which openvidu listens, uncomment the following lines

# Allows any request to http://DOMAIN_OR_PUBLIC_IP:HTTP_PORT/ to be automatically
# redirected to https://DOMAIN_OR_PUBLIC_IP:HTTPS_PORT/.
# WARNING: the default port 80 cannot be changed during the first boot
# if you have chosen to deploy with the option CERTIFICATE_TYPE=letsencrypt

# NGINX의 포트를 변경한다.

HTTP_PORT=8081

# Changes the port of all services exposed by OpenVidu.
# SDKs, REST clients and browsers will have to connect to this port
HTTPS_PORT=8443

...

기존 openvidu 인증 파일 삭제

만약 /opt/openvidu경로 안에 certificates 폴더가 존재한다면 설정한 환경에 인증서가 제대로 적용되지 않을 때가 있다.

이 경우 폴더 자체를 삭제해 주면 된다.

# /opt/openvidu
$ sudo rm -rf certificates

openvidu-insecure-react 실행

$ docker run -p 8443:8443 --rm -e OPENVIDU_SECRET=MY_SECRET openvidu/openvidu-server-kms:2.19.0

필자의 환경에서는 이상하게 docker ps로 실행중인 컨테이너를 확인해봐도 openvidu-server-kms 이미지가 실행중으로 표시되지 않았다 ...

하지만 이상하게 이걸 한번 run 해줘야 실행이 잘 되는 ..

openvidu On Promises 실행

# /opt/openvidu

$ ./openvidu start

# 종료할 때는 같은 경로에서
$ ./openvidu stop을 하면 된다.

접속 확인

./openvidu start가 정상적으로 실행되면 마지막에 openvidu의 접속 uri가 나온다.

https://<설정한 도메인 or IP>:8443/

으로 접속했을 때 아래 이미지와 같이 뜨면서

포트번호를 지우고 기존 도메인으로 접속했을 때 본인 프로젝트의 welcome page가 뜬다면 설정이 완료된다.