Peerjs not sending stream between Android and IOS WebRTC
I am trying to create a video conference web app using peer/getUserMedia. when I tried to make the connection stream sending/receiving both platform not working I want to make it so the other user can see/hear local user thats in the video session.
this is my code
let localVideo = document.getElementById("local-video")
let remoteVideo = document.getElementById("remote-video")
let peer
function init(userId) {
var config = { 'iceServers': [{ 'urls': ['stun:stun.l.google.com:19302'] }] };
peer = new Peer(userId, config)
listen();
return peer;
}
let localStream
function listen() {
peer.on('call', (call) => {
navigator.getUserMedia({
audio: true,
video: true
}, (stream) => {
localVideo.srcObject = stream
localStream = stream
call.answer(stream)
call.on('stream', (remoteStream) => {
remoteVideo.srcObject = remoteStream
remoteVideo.className = "primary-video"
localVideo.className = "secondary-video"
})
})
})
}
function startCall(otherUserId) {
navigator.getUserMedia({
audio: true,
video: true
}, (stream) => {
localVideo.srcObject = stream
localStream = stream
const call = peer.call(otherUserId, stream)
call.on('stream', (remoteStream) => {
remoteVideo.srcObject = remoteStream
remoteVideo.className = "primary-video"
localVideo.className = "secondary-video"
})
})
}
<html>
<body>
<script src="https://unpkg.com/[email protected]/dist/peerjs.min.js"></script>
<video class="secondary-video" autoplay id="remote-video"></video>
<video class="primary-video" autoplay muted id="local-video"></video>
<script src="./call.js"></script>
</body>
</html>
any help ???
getUserMedia is deprecated and won’t work on most browsers.
So what's the alternative ? Peerjs offical website uses getUserMedia
Oh, you’re right. Need to update the docs.
navigator.mediaDevices.getUserMedia, I think.
Your code runs flawlessly on Safari, but fails in Firefox with an Exception that getUserMedia is undefined.
I changed getUserMedia and still not working , no need for me to run in Firefox , I tested it for Android and IOS but it didn't work now
let peer
function init(userId) {
var config = { 'iceServers': [{ 'urls': ['stun:stun.l.google.com:19302'] }] };
peer = new Peer(userId, config)
listen();
return peer;
}
let localStream
function listen() {
peer.on('call', (call) => {
navigator.mediaDevices.getUserMedia({
audio: true,
video: true
}, (stream) => {
localVideo.srcObject = stream
localStream = stream
call.answer(stream)
call.on('stream', (remoteStream) => {
remoteVideo.srcObject = remoteStream
remoteVideo.className = "primary-video"
localVideo.className = "secondary-video"
})
})
})
}
function startCall(otherUserId) {
navigator.mediaDevices.getUserMedia({
audio: true,
video: true
}, (stream) => {
localVideo.srcObject = stream
localStream = stream
const call = peer.call(otherUserId, stream)
call.on('stream', (remoteStream) => {
remoteVideo.srcObject = remoteStream
remoteVideo.className = "primary-video"
localVideo.className = "secondary-video"
})
})
}
worked perfect in ios
let localVideo = document.getElementById("local-video") let remoteVideo = document.getElementById("remote-video") var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
localVideo.style.opacity = 0 remoteVideo.style.opacity = 0
localVideo.onplaying = () => { localVideo.style.opacity = 1 } remoteVideo.onplaying = () => { remoteVideo.style.opacity = 1 }
let peer function init() {
// peer = new Peer(userId, { // host: '192.168.0.102', // port: 9000, // path: '/videocallapp' peer = new Peer(undefined, { host: 'yourhost', port: 443, secure:true // path: '/videocallapp'
})
peer.on('open', (peerId) => {
webkit.messageHandlers.bridge.postMessage(peerId)
peer.on('call', (call) => {
getUserMedia({
audio: true,
video: true
}, (stream) => {
localVideo.srcObject = stream
localStream = stream
call.answer(stream)
call.on('stream', (remoteStream) => {
remoteVideo.srcObject = remoteStream
remoteVideo.className = "primary-video"
remoteVideo.playsInline = true;
localVideo.className = "secondary-video"
localVideo.playsInline = true;
})
})
})
})
}
let localStream
function initForStartCall(otherUserId, audio, video) { peer = new Peer(undefined, { host: 'mypeerjs3002.herokuapp.com', port: 443, secure:true
})
peer.on('open', (peerId) => {
getUserMedia({audio: true,
video: true}, (stream) => {
localVideo.srcObject = stream
localStream = stream
localVideo.className = "secondary-video"
localVideo.playsInline = true;
const call = peer.call(otherUserId, stream)
call.on('stream', (remoteStream) => {
remoteVideo.srcObject = remoteStream
remoteVideo.className = "primary-video"
remoteVideo.playsInline = true;
})
})
})
}