navigator.mediaDevices undefined 해결

MediaDevices 인터페이스는 카메라, 마이크, 공유 화면 등 현재 연결된 미디어 입력 장치로의 접근 방법을 제공하는 인터페이스입니다. 다르게 말하자면, 미디어 데이터를 제공하는 모든 하드웨어로 접근할 수 있는 방법입니다. - MDN

문제 해결법 참고

원인

최신 크롬에선 안전하지 않을경우, 즉 https가 아닐경우
mediaDevices 객체를 제공하지 않는다고 한다.

해결법

chrome://flags/#unsafely-treat-insecure-origin-as-secure

위 링크에 들어가, 보안 정책을 무시할려는 주소를 적고 재시작한다

포트가 있을경우, 포트까지 적어준다

http://localhost:3000 등...