참고링크 : 참고한 블로그
브라우저에서)
사용자가 방 입력 폼에 방 이름 입력
=> 이벤트리스너에 의해 handleWelcomeSubmit 호출
handleWelcomeSubmit
=> initCall 호출
initCall
=> 방 입력 폼 숨기고 화면 표시 요소 보이게함
=> getMedia 호출
getMedia
=> constraint 객체 만들어서 getUserMedia로 myStream 초기화 (사용자가 선택한 카메라로 스트림 가져옴)
=> 맨 처음 getMedia를 호출할 때는 getCameras 호출, getCameras는 사용자 카메라 목록을 가져와서 선택할 수 있게 표시해줌
=> makeConnection 호출
makeConnection
=> myPeerConnection 객체생성
=> icecandidate 이벤트리스너 handleIce 등록
=> handleIce는 room의 모든 사용자에게 ice 이벤트 발생(data.candidate 담아서 보냄)
=> addstream 이벤트리스너 handleAddStream 등록
=> handleAddStream은 뷰페이저에 다른 사람의 스트림 추가 (다른 사람 화면이 보이게됨)
=> myStream에서 getTracks로 트랙을 가져와서 각각 myPeerConnection에 addTrack으로 영상, 음성을 등록해서 p2p 연결
=> join_room 이벤트 발생시킴, 입력한 방 이름도 같이 보냄
서버에서)
join_room 이벤트처리
=> 해당 room의 모든 사용자에게 welocme 이벤트 발생
브라우저에서)
welcome 이벤트처리
=> offer 생성
=> offer를 localDescription으로등록
=> offer 이벤트 발생 (roomName과 offer 담아서 보냄)
서버에서)
offer 이벤트처리
=> room의 모든 사용자에게 offer 이벤트 발생(받은 offer담아서 보냄)
브라우저에서)
offer 이벤트처리
=> offer를 remoteDescription으로 등록
=> answer 생성
=> answer를 localDescription으로 등록
=> answer 이벤트 발생 (answer를 담아서 room에 있는 모든 사용자에게)
answer 이벤트처리
=> answer를 RemoteDescription으로 등록
서버(브라우저) 끼리 무언가 송수신할 때 icecandidate 이벤트 발생
서버에서)
ice 이벤트처리
=> room의 모든 사용자들에게 ice 이벤트 발생 (ice 담아서 보냄)
브라우저에서)
ice 이벤트처리
=> myPeerConnection 에 ice 등록
