๋ค์๊ณผ ๊ฐ์ ์ฌ์ฉ ์ฌ๋ก๊ฐ ์์ต๋๋ค.
์ด ์ฌ์ฉ ์ฌ๋ก์ ๊ฒฝ์ฐ ๋ทฐ์ด ์ธก์์ ๋ค์์ด ํ์ํฉ๋๋ค.
var call = peer.call(presenterPeerID, null);
call.on('stream', function(theirWebcamStream) {
showWebcamStream(theirWebcamStream);
});
peer.call(presenterPeerID, null)
๊ฐ undefined
$ ๋ฅผ ๋ฐํํ๊ธฐ ๋๋ฌธ์ ์ด๊ฒ์ ์๋ํ์ง ์์ต๋๋ค.
MediaStream์ ๋ณด๋ด์ง ์๊ณ ์ด๋ป๊ฒ ํธ์ถํฉ๋๊น?
์ด๋ฒ ํธ ๊ตฌ๋
๋ฐํ์์์ ๋ทฐ์ด๋ก์ ํธ์ถ์ ์์ํ๊ณ ํธ์ถ์์ ๋ฐํ์์๊ฒ ๋ฏธ๋์ด ์คํธ๋ฆผ์ ์ ๊ณตํ๊ณ null์ ๋ฏธ๋์ด ์คํธ๋ฆผ์ผ๋ก ์ฌ์ฉํ์ฌ ํธ์ถ์ ์๋ตํด ๋ณด์ จ์ต๋๊น?
์ ๋ ๊ฐ์ ์ผ์ ํ๊ธฐ๋ฅผ ๋ฐ๋ผ๊ณ ์์ต๋๋ค. ๋ฌธ์ #158 ์ฐธ์กฐ
+1
๋ชจ๋ ํธ๋ ๋๋ ๋ ๊ฐ์ง ๋ชจ๋๋ฅผ ์ฌ์ฉํ์ฌ ๋น ์คํธ๋ฆผ์ ๋ง๋ค ์ ์์ต๋๋ค.
export const createEmptyAudioTrack = () => {
const ctx = new AudioContext();
const oscillator = ctx.createOscillator();
const dst = oscillator.connect(ctx.createMediaStreamDestination());
oscillator.start();
const track = dst.stream.getAudioTracks()[0];
return Object.assign(track, { enabled: false });
};
export const createEmptyVideoTrack = ({ width, height }) => {
const canvas = Object.assign(document.createElement('canvas'), { width, height });
canvas.getContext('2d').fillRect(0, 0, width, height);
const stream = canvas.captureStream();
const track = stream.getVideoTracks()[0];
return Object.assign(track, { enabled: false });
};
...
const audioTrack = createEmptyAudioTrack();
const videoTrack = createEmptyVideoTrack({ width:640, height:480 });
const mediaStream = new MediaStream([audioTrack, videoTrack]);
peer.call('id', mediaStream);
๊ฐ์ฅ ์ ์ฉํ ๋๊ธ
๋ชจ๋ ํธ๋ ๋๋ ๋ ๊ฐ์ง ๋ชจ๋๋ฅผ ์ฌ์ฉํ์ฌ ๋น ์คํธ๋ฆผ์ ๋ง๋ค ์ ์์ต๋๋ค.