Client코드를 작성하기 앞서, Intel에서 제공한 샘플코드를 참고하여 사용하는 법을 익히려고 합니다.
모든 코드는 아래의 참고자료의 owt-client-javascript repo를 기준으로 합니다
src/samples/conference/public/scripts/index.js
를 보면 기본적인 conference를 생성/접속하는 법이 나와있는 것 같다.
134번째 줄부터 시작하는 window.onload
에 createToken을 하고, 만들어진 tokenString을 callback함수에 넘겨 conference에 입장한다.
createToken()
은 src/samples/conference/public/scripts/rest-sample.js
에 있다. 이 부분은 자신의 필요에 맞게 바꾸면 될것 같다.
그리고 조금 더 내려가면 가장 중요한 conference.join(token).then( ....
이 있는데 여기서 token이 어떤정보를 가지고 있어야되는지를 알아야한다. src/sdk/conference/client.js
를 보면 ConferenceClient
클래스 안에 this.join
이 있다.
Custom signaling
custom signaling을 사용하려면 conference = new Owt.Conference.ConferenceClient();
로 ConferenceClient를 생성할 때 두번째 인자로 넣어주면된다. 이 객체는 .send()
, .connect()
, .disconnect()
를 가지고 있어야하며 disconnect했을때와 참여자, 스트림 등이 바뀌었을때 처리할 수 있도록 disconnect
와 data
이벤트를 발생시켜야한다. 실제 스트림 등 데이터를 전달하고 싶으면 data 이벤트를 발생시켜 처리힌다. 그러면 ConferenceClient는 onSignalingMessage()
를 호출해 처리한다.
new Owt.Conference.ConferenceClient(config, signalImp)
두번째인자는 앞에서 언급한대로 자신만의 signaling을 구현하고 싶을때 넘겨주고, config는 sdk > conference > client.js의 createPeerConnectionChannel()
에서 new ConferencePeerConnectionChannel(config, signalingForChannel)
에서 인자로 넘어간다. 그러므로 config의 host에는 media server로 연결되는 host가 있어야되는 것 같다.
conference.join(tokenString)
join을 살펴보면 처음에 tokenString을 Base64.decodeBase64로 복호화를 한다. 따라서 toikenString은 base64로 암호화되어있어야한다.
그리고 아래 나오는 코드를 보면 join에서 token.secure
와 token.host
를 접근하는데 token.secure은 정의되지않아도 (token.secure === true)
에 의해 false로 바뀌어 isSecure
에 저장되므로 괜찮다. token.host
는 http 프로토콜을 붙이지 않으면 isSecure를 검사해서 http나 https를 붙여주는데 만약 자신의 서버가 https://인데 token.secure를 true로 하지도 않고 host에도 붙이지 않으면 잘못된 host로 접근할 것이다.
signalingState
는 READY, CONNECTING, CONNECTED가 있으며 접속하는 중이거나 이미 접속된 상태에서 join을 호출하면 더 이상 진행하지않고 종료한다. 아무와도 연결되지않은 READY상태라면 CONNECTING으로 바꾸고 계속 진행한다.
아직 이해되지 않는점:conference.join(tokenString)
을 호출하면 tokenString을 decode하고, token에서 host를 signaling.connect(host)로 넘겨준다. 그렇다면 coference.join(token)의 host는 signaling 서버의 url이라는 뜻인데.. 이전에 연결할때는 wss프로토콜을 사용하였었다. 그런데 conference.join에서는 wss가 아니라 https 혹은 http를 붙여서 보내주는데 음.. 뭔가 잘못이해한건가
참고자료:
https://software.intel.com/sites/products/documentation/webrtc/js/index.html
https://github.com/open-webrtc-toolkit
https://github.com/open-webrtc-toolkit/owt-client-javascript
'프론트엔드' 카테고리의 다른 글
Janus screen sharing 만들기 (1) | 2020.03.19 |
---|---|
Janus media server 설치하기 (4) | 2020.03.17 |
8. GraphQL Introspection (0) | 2019.12.26 |
7. GraphQL Subscription (0) | 2019.12.26 |
6. GraphQL Mutations (0) | 2019.12.26 |