RTCPeerConnection is creating invalid SDP with createOffer function - react-native

Im using 1.87.3 react-native-webrtc and react-native 0.64.3 Android 11. Im using this function for createOffer but its produces an incomplete sdp. When i createOffer from web side client its success, rnative and web side can communicate. But when i try to createoffer from React native side its creating invalid sdp. Is there any idea?
peer.createOffer().then(desc => { console.log(desc); peer.setLocalDescription(desc).then(() => { //do something }); });
This is created SDP by CreateOffer function = "v=0 ↵o=- 7968195522823789820 2 IN IP4 127.0.0.1 ↵s=- ↵t=0 0 ↵a=msid-semantic: WMS ↵"

Sorry i should have to call addStream function before creating an offer.

Related

Why setRemoteDescription on RTCPeerConnection instance is failing with message Session Description is NULL?

I am using react-native-webrtc to implement livestreaming
React native version: 0.66.4,
react native webrtc version:^1.94.2
I have 2 separate screens for the person who creates the livestream and people who join on the stream and on both sides I am creating an instance of RTCPeerConnection (outside the body of the screen component) as follows:
const configuration = {iceServers: [{url: 'stun:stun.l.google.com:19302'}]};
const pc = new RTCPeerConnection(configuration);
I have this other function for creating offer:
const createOffer = async () => {
const offer = await pc.createOffer();
offerRef.current = offer;
// await pc.setLocalDescription(offer);
}
For the moment I commented out the pc.setLocalDescription because it's throwing an error:PeerConnection not found
This is what the offer looks:
{"sdp": "v=0 o=- 4201814093591570700 2 IN IP4 127.0.0.1 s=- t=0 0 a=extmap-allow-mixed a=msid-semantic: WMS", "type": "offer"}
then through the signaling server I am sending this offer to the other peer who is trying to join the streaming and on his side I am trying to do :
pc.setRemoteDescription(offer)
but it is giving me error
{
"message": "SessionDescription is NULL.",
"name": "SetRemoteDescriptionFailed",
}
Any idea why is this happening I checked the offer on both sides and they are identical and also I don't understand why I am getting that PeerConnection is NULL error could that be causing all this?
Note: The pc instance on the person who creates the live stream and the person who is trying to join the stream is not the same they are both declared same way tho with the same configuration.

postman websocket api, "connected" - but no messages or acknowledgement from server

I can not get postman to connect to the server using websockets.
const port =5001;
io.on("connection", (socket) => {
console.log("Client connected",socket.id);
socket.emit("handshake","connected to backend");
socket.on("test", (data)=>{
console.log("test data is:",data);
socket.emit("test", "server heard you!")
});
}
in postman the request address is:
ws://localhost:5001/socket.io/?transport=websocket
the symptoms are: postman says it's connected. but if I try to send anything - it disconnects after a timeout.
if I set the reconnection attempts to 1, it will automatically reconnect when it disconnects...
but I don't think it's actually connecting - because nothing is happening on the server (no new client connected message)
the format of messages I have also experimented with, to no avail.
42["test","i hear you"]
42[test,i hear you]
["test":"i hear you"]
{"test":"I hear you"}
42{"test":"I hear you"}
{"event":"test","data":"I hear you"}
42{"event":"test","data":"I hear you"}
42["event","test","data","I hear you"]
["event","test","data","I hear you"]
I have inspected the console results, and have not found leads there yet. what could I be missing?
You are using socket.io as WebSocket and that does not work because socket.io is not an implementation of websocket.
From official socket.io documentation:
Socket.IO is NOT a WebSocket implementation. Although Socket.IO indeed uses WebSocket as a transport when possible, it adds additional metadata to each packet. That is why a WebSocket client will not be able to successfully connect to a Socket.IO server, and a Socket.IO client will not be able to connect to a plain WebSocket server either.
// WARNING: the client will NOT be able to connect!
const socket = io("ws://echo.websocket.org");
Source: https://socket.io/docs/v4#What-Socket-IO-is-not
Postman v8.10.0 added support for Socket.IO, read more.
Just enter ws://localhost:5001 as the connection URL and hit Connect.
Also, you can configure the client version (default: v3), handshake path (default: /socket.io), and other reconnection configurations in the request settings.
Because you don not add listener. Add listener "handshake" to postman. You will receive message.
This is my code:
io.on('connection', () => {
console.log('user connected');
setInterval(() => {
io.emit('msg', { data: [1, 2, 3] });
}, 5000);
});

Socket.io will not accept connection

Working on socket.io for the first time and trying to get it up and going, I can make the request and I have the server up and going, here is the server in node.
const app = require('express')();
const http = require('http').createServer(app);
const io = require('socket.io')(http);
app.get("/",function (req,res){
res.send("Hello you socket loving bastard!");
});
io.on('connection', socket => {
console.log('user connection', socket);
io.emit('You got someone!', {user: "me"});
});
io.on('close', socket => {
console.log(socket);
});
http.listen(9090, () => {
console.log("Node starting on 9090 for websockets!")
});
Using vue-native-websocket I have this ...
Vue.use(Socket, 'ws://localhost:9090/', {
reconnection: true,
reconnectionAttempts: 5,
reconnectionDelay: 1500
});
The console in the browser says:
build.js?b408:1 WebSocket connection to 'ws://localhost:9090/' failed: Connection closed before receiving a handshake response
The server says nothing in the console at all, however, it will serve the get request
Well... the issue is that I'm using vue-native-websocket Socket.io is NOT a native websocket handler and adds extra header information which was lacking apparently. I switches to just using ws in node and it works fine.
From the Socket.io docs.
Socket.IO is NOT a WebSocket implementation. Although Socket.IO indeed uses WebSocket as a transport when possible, it adds some metadata to each packet: the packet type, the namespace and the packet id when a message acknowledgement is needed. That is why a WebSocket client will not be able to successfully connect to a Socket.IO server, and a Socket.IO client will not be able to connect to a WebSocket server either.

How to pass query parameters in react native WebSocket connection

I have a server where I can make a WebSocket connection. When a device makes a WebSocket connection (when the app starts/splash screen), the server looks for the query parameter in the URL, which has the auth token of the user and if the token is correct, the connection is approved, else connection is rejected.
This is how the code looks on the react native client side:
const socket = new WebSocket(`ws://${website}/?token=${value}`);
socket.onmessage = (messageEvent) => {
console.log('>>> socket on message:', messageEvent.data);
};
socket.onopen = function () {
socket.send("hello world connection");
};
socket.onclose = () => {
console.log('Socket disconnected');
};
This works fine in my iOS emulator, and the iOS emulator has a WebSocket connection to mine server. However, I have an android phone (testing via LAN), and when I open the app, I get an error saying:
Unable to set ws://192.xxx.xx.xx/token=aut sfiseft2sefsefs..... as default origin header
But, if I remove the query param from the URL
const socket = new WebSocket(`ws://${website}`);
This works fine, but since I cannot pass the token in the query params, I get an error from the server.
How can I pass query parameters to the WebSocket connection in android? What am I doing wrong?
I have the same issue. Solve the issue by using encodeURI() before passing the url to WebSocket.
const uri = encodeURI(`ws://${website}/?token=${value}`);
const socket = new WebSocket(uri);
This works for me.

PubNub WebRTC library - how to end session

I'm using PubNub's WebRTC library to start a WebRTC session and show the local video stream. How can I end the session, unsubscribe and remove the stream again?
var phone = window.phone = PHONE({
number : 12345,
publish_key : '...',
subscribe_key : '...',
ssl: true
});
var ctrl = window.ctrl = CONTROLLER(phone);
phone.ready(function(){
ctrl.addLocalStream(document.getElementById("vid-thumb"))
});
WebRTC Session Hangup
session.hangup()
End the session right now.
The 'ended' callback will fire for both connected parties on either side of the call.
$("#hangup").click(function(){
// End the call
session.hangup();
});
WebRTC Phone Hangup
phone.hangup()
There are two ways to hangup WebRTC calls.
You can use the phone-level method phone.hangup()
which will hangup all calls at once.
Or you can use the session-level method session.hangup()
which will only hangup that call session.
// hangup all calls
phone.hangup();
// hangup single session
session.hangup();
🔗 Source: https://github.com/stephenlb/webrtc-sdk/#webrtc-session-hangup