Peerjs: рдореИрдВ рдореАрдбрд┐рдпрд╛рд╕реНрдЯреНрд░реАрдо рдХреЗ рдмрд┐рдирд╛ рдХреИрд╕реЗ рдХреЙрд▓ рдХрд░реВрдВ?

рдХреЛ рдирд┐рд░реНрдорд┐рдд 8 рдЬрдире░ 2016  ┬╖  5рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: peers/peerjs

рдореЗрд░реЗ рдкрд╛рд╕ рдПрдХ рдЙрдкрдпреЛрдЧ-рдорд╛рдорд▓рд╛ рд╣реИ рдЬрд╣рд╛рдВ:

  • рджреЛ рд▓реЛрдЧ рд╣реИрдВ, рдкреНрд░рд╕реНрддреБрддрдХрд░реНрддрд╛ рдФрд░ рджрд░реНрд╢рдХ
  • рдкреНрд░рд╕реНрддреБрддрдХрд░реНрддрд╛ рдкреГрд╖реНрда рдЦреЛрд▓рддрд╛ рд╣реИ рдФрд░ рдПрдХ рд╕рд╣рдХрд░реНрдореА рдЖрдИрдбреА рдкреНрд░рд╛рдкреНрдд рдХрд░рддрд╛ рд╣реИ
  • рдкреНрд░рд╕реНрддреБрддрдХрд░реНрддрд╛ рдЙрд╕ рдкреАрдпрд░ рдЖрдИрдбреА рдХреЛ рд╡реНрдпреВрдЕрд░ рдХреЛ рднреЗрдЬрддрд╛ рд╣реИ
  • рдкреНрд░рд╕реНрддреБрддрдХрд░реНрддрд╛ рдХреЛ рдХреЙрд▓ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рджрд░реНрд╢рдХ рдЙрд╕ рд╕рд╣рдХрд░реНрдореА рдЖрдИрдбреА рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реИ
  • рдкреНрд░рд╕реНрддреБрддрдХрд░реНрддрд╛ рдЕрдкрдиреА рд╕рд╛рдЭрд╛ рд╕реНрдХреНрд░реАрди рджрд░реНрд╢рдХ рдХреЛ рднреЗрдЬрддрд╛ рд╣реИ

рдЗрд╕ рдЙрдкрдпреЛрдЧ-рдорд╛рдорд▓реЗ рдХреЗ рд▓рд┐рдП рдореБрдЭреЗ рджрд░реНрд╢рдХ рдкрдХреНрд╖ рдХреЗ рд▓рд┐рдП рдЪрд╛рд╣рд┐рдП:

var call = peer.call(presenterPeerID, null);
call.on('stream', function(theirWebcamStream) {
  showWebcamStream(theirWebcamStream);
});

рдпрд╣ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ, рдХреНрдпреЛрдВрдХрд┐ peer.call(presenterPeerID, null) undefined $ рд▓реМрдЯрд╛рддрд╛ рд╣реИред

рдореИрдВ MediaStream рднреЗрдЬреЗ рдмрд┐рдирд╛ рдХреИрд╕реЗ рдХреЙрд▓ рдХрд░реВрдВ?

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

рдЖрдк рдХрд┐рд╕реА рднреА рдЯреНрд░реИрдХ рдпрд╛ рджреЛрдиреЛрдВ рдХреЗ рд╕рд╛рде рдЦрд╛рд▓реА рд╕реНрдЯреНрд░реАрдо рдмрдирд╛ рд╕рдХрддреЗ рд╣реИрдВ:

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);

рд╕рднреА 5 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

рдЗрд╕ рдореБрджреНрджреЗ рдХреА рд╕рджрд╕реНрдпрддрд╛ рд▓реЗрдВ

рдХреНрдпрд╛ рдЖрдкрдиреЗ рдкреНрд░рд╕реНрддреБрддрдХрд░реНрддрд╛ рд╕реЗ рджрд░реНрд╢рдХ рдХреЗ рд▓рд┐рдП рдХреЙрд▓ рд╢реБрд░реВ рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХреА рд╣реИ, рдкреНрд░рд╕реНрддреБрддрдХрд░реНрддрд╛рдУрдВ рдХреЛ рдХреЙрд▓ рдореЗрдВ рдореАрдбрд┐рдпрд╛рд╕реНрдЯреНрд░реАрдо рдкреНрд░рджрд╛рди рдХрд┐рдпрд╛ рд╣реИ рдФрд░ рдХреЙрд▓ рдХрд╛ рдЙрддреНрддрд░ рдореАрдбрд┐рдпрд╛рд╕реНрдЯреНрд░реАрдо рдХреЗ рд░реВрдк рдореЗрдВ рд╢реВрдиреНрдп рдХреЗ рд╕рд╛рде рджрд┐рдпрд╛ рд╣реИ?

рдореИрдВ рднреА рдпрд╣реА рдХрд╛рдо рдХрд░рдиреЗ рдХреА рдЙрдореНрдореАрдж рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рдЕрдВрдХ рджреЗрдЦреЗрдВ #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);
рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

marcoippolito picture marcoippolito  ┬╖  9рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

l2aelba picture l2aelba  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

RikdeVos picture RikdeVos  ┬╖  6рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

bilo1967 picture bilo1967  ┬╖  7рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

jameshfisher picture jameshfisher  ┬╖  6рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ