Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problem with mediaConnection.on('stream') in react-native #612

Closed
Ponao opened this issue Dec 24, 2019 · 2 comments
Closed

Problem with mediaConnection.on('stream') in react-native #612

Ponao opened this issue Dec 24, 2019 · 2 comments

Comments

@Ponao
Copy link

@Ponao Ponao commented Dec 24, 2019

My actions:

  1. install peerjs
  2. At the beginning of the peerjs.min.js file, import react-native-webrtc
  3. Trying to connect to the client in the browser
  4. The peerPrivate.on('call') event fires and I answer the call and listen to the stream event
  5. nothing else happens, on.('Stream') is not working in react native and not in the browser (provided that the calling or receiving client is react-native)

Here is my react-native code

privatePeer.on('call', call => {
        mediaDevices.getUserMedia({
            audio: true,
            video: true
            })
            .then(stream => {
               call.answer(stream)
            })
    
        call.on('error', console.log)
    
        call.on('stream', stream => {
            console.log(123)
        })
    })

Here is my web code

var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia
                                                
    getUserMedia({video: true, audio: true}, (stream) => {
      let call = p.call(id, stream, options)

      call.on('stream', (remoteStream) => {
        console.log(123)
        var video = document.querySelector('video')
    
        if ('srcObject' in video) {
          video.srcObject = remoteStream
        } else {
          video.src = window.URL.createObjectURL(remoteStream) // for older browsers
        }
    
        video.play();
      })
      call.on('error', (err) => {
        console.log(err)
    })
    }, (err) => {
      
    })

The call.on('stream') event does not fire in either the browser or react native

@Ponao Ponao changed the title Problem with mediaConnection.on('stream') Problem with mediaConnection.on('stream') in react-native Dec 24, 2019
@afrokick

This comment has been minimized.

Copy link
Member

@afrokick afrokick commented Dec 24, 2019

Could you please create a test repo to reproduce the issue?

@Ponao

This comment has been minimized.

Copy link
Author

@Ponao Ponao commented Dec 24, 2019

Thank you so much for the @afrokick solution.

As a temporary solution:

  1. You need to implement addTrack method:
RTCPeerConnection.prototype.addTrack = function (track, stream) {
    this.addStream (stream); 
} 

or maybe

RTCPeerConnection.prototype.addTrack = function (track, stream) {
    this.addStream (new MediaStream ([track])); 
}
  1. You need to handle onaddstream if ontrack not working:
call.peerConnection.onaddstream = function (event) {
   call.addStream (event.stream, call);
}

the first step - before call new Peer
the second - after create | receive a call(MediaConnection)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
2 participants
You can’t perform that action at this time.