이것은 마이넷 엔터테인먼트 Advent Calendar 9 일째 기사입니다.

여러분 안녕하세요.
산 속에서 동물들과 살고 있던 곳을 데리고 오셔서, 눈치 채면 도쿄에서 소셜 게임의 개발을 하고 있었습니다.
인생은 무슨 일이 일어날지 모르겠다.

WebRTC 도입의 계기

그런데, 이미 달력은 12월. 상당히 추워졌습니다.
자신은 사냥 면허도 가지고 있기 때문에, 이 시기는 산에 함정을 걸러 갑니다.

그러나 여기서 하나의 문제가.
함정을 걸면, 둘러보러 가야 합니다.

장치는 단지마저 산속인데, 이 시기라든지 이미 춥고.
벌레라든가 있고, 그다지 나오고 싶지 않잖아요.
우치의 뒷면 이런 느낌이고.


그래서 어떻게든 집에서 WebRTC를 사용하여 감시 환경을 만들기로 결정했습니다.

WebRTC란

브라우저간에 화상 채팅이나 파일 공유 등 P2P로 여러가지 통신할 수 있게 되는 API입니다.
NAT를 넘는 서버가 필요하지만 google 등에서도 제공되고 있기 때문에 (stun.l.google.com:19302) 자체 서버가 없어도 괜찮습니다.
그리고 몇 년 전부터 미묘하게 유행할 것 같아 유행하지 않는 느낌.

이 녀석에서 저렴한 스마트 폰을 사용하여 집에서도 산 중 함정의 모습을 감시 할 수 있습니다.

준비한 것

AWS S3 (html 넣는 데 사용)
SimpleWebRTC(WebRTC용 라이브러리)

TURN/STUN 서버 준비하는 것도 힘들기 때문에 SimpleWebRTC를 이용시켜 주었습니다.

사용법

먼저 simplewebrtc 로드

index.html

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="https://simplewebrtc.com/latest-v2.js"></script>

다음으로 객체 만들기

index.html

var webrtc = new SimpleWebRTC({
                remoteVideosEl: 'remoteVideo',
                autoRequestMedia: true
            });

"trap"이라는 비디오 창에 넣습니다.

webrtc.on('readyToCall', function () {
    webrtc.joinRoom('trap');
});

마지막으로 상대방의 영상을 비추는 요소를 놓습니다.

<div id='remoteVideo'></div>

다른 브라우저에서 페이지를 열고 비디오 영상이 공유되면 준비 OK입니다!
그리고는 저렴한 SIM이나 뭔가의 스마트 폰을 함정 근처에 장치에 갑시다!

요약

1. 발자국을 찾습니다.
2. 누타장을 찾습니다.
3. 함정을 설치합니다.
4. SimpleWebRTC를 넣은 페이지를 준비합니다.
5. 페이지를 열고 함정 근처에 스마트폰을 설치합니다.
6. 돌아가서 수면 모드가 되지 않기를 기도하고 잠을 자십시오.

이상입니다!
자 준비가 되면 나가자!

다음 번은 taka3110 씨입니다! 잘 부탁드립니다! !

참고

SimpleWebRTC
htps : // 기주 b. 코 m / an ぇ t / mp ぇ ぇ bRTC
Getting Started with WebRTC
htps //w w. 아마존. 이 m/Getchin g-S-r-d-u-bRTC-ro b-mansang / dp/1782166300
「대일본 사냥회」
h tp // w w. 가자. jp/