뮤랑이는 표정 분석할 때 HTML Camera API를 사용해서 실시간 표정을 받아온다. 로컬에서 테스트해보고 모든 기능들이 문제없이 돌아가기에 배포했는데, 웹캠만 안 켜지는 에러가 발생했다.
처음 배포할 때 가비아에서 도메인(http://www.murange.site) 구매 후 AWS EC2를 통해 서버 배포를 했었는데, 다음과 같은 에러가 발생했다.
Uncaught TypeError: Cannot read properties of undefined (reading 'getUserMedia')
알고보니 최신 Chrome에서 Camera API는 보안 문제때문에 https에서만 동작한다고 한다. 로컬 테스트할때 정상 동작했던 이유는, 로컬에서 테스트하는 경우(http://localhost)에는 안전하다고 보아 특별히 http에서도 동작할 수 있다고 한다.
http이더라도 chrome://flags/#unsafely-treat-insecure-origin-as-secure에 등록해주면 보안 정책을 무시하고 사용할 수 있다고 한다. 그래도 보안 + 경험을 위해 https로 등록해주기로 했다. 그래서 http가 아닌 https로 배포를 해주고, http로 들어오는 입력도 https로 리다이렉트해주기로 했다.
HTTPS로 배포하는 과정은 아래 개발일지에 자세히 기록해두었다!