React-Native connection?

I'm struggling to get a react-native client to connect to my membrane server. I'm just running locally right now. I start my membrane server with EXTERNAL_IP={my ip} mix phx.server. I'm using the @jellyfish-dev/react-native-membrane-webrtc client in my react native code Then I have the following connection code in my react-native view. I see the console log statements for init connect and attempting connect. But it never connects. I don't see a connection message in my phoenix server, nor the successful connection message. I tried increasing the log verbosity, but didn't get anything out of the logs from react-native. Is there something obviously wrong with my connection string? Is it expecting something different for the server URL?
const startServerConnection = async () => {
const deviceID = await getUniqueId();

try {
console.log('attempting connnect')
//Should make this environment aware at some point
connect('https://192.168.121.87:4001/socket/', "room:" + deviceID, {
endpointMetadata: {
displayName: deviceID,
},
socketChannelParams: {
childrenNames: params.childrenNames,
talkAbout: params.talkAbout
}
}).then(() => {
console.log('connected. starting mic')
startMicrophone({ audioTrackMetadata: { active: true, type: 'audio' } });
}).catch((e) => {
console.log('connection error: ' + e);
});

} catch (e) {
console.log('connection error: ' + e);
}
};

useEffect(()=>{
let isMounted = true;
const logLevel: LoggingSeverity = LoggingSeverity.Verbose
changeWebRTCLoggingSeverity(logLevel)
const initConnection = async ()=>{
try {
console.log('init connnect')
await startServerConnection();
if (isMounted) {
setIsConnected(true)
}
} catch (error) {
console.log('init connection error: ' + error)
}
}
const startServerConnection = async () => {
const deviceID = await getUniqueId();

try {
console.log('attempting connnect')
//Should make this environment aware at some point
connect('https://192.168.121.87:4001/socket/', "room:" + deviceID, {
endpointMetadata: {
displayName: deviceID,
},
socketChannelParams: {
childrenNames: params.childrenNames,
talkAbout: params.talkAbout
}
}).then(() => {
console.log('connected. starting mic')
startMicrophone({ audioTrackMetadata: { active: true, type: 'audio' } });
}).catch((e) => {
console.log('connection error: ' + e);
});

} catch (e) {
console.log('connection error: ' + e);
}
};

useEffect(()=>{
let isMounted = true;
const logLevel: LoggingSeverity = LoggingSeverity.Verbose
changeWebRTCLoggingSeverity(logLevel)
const initConnection = async ()=>{
try {
console.log('init connnect')
await startServerConnection();
if (isMounted) {
setIsConnected(true)
}
} catch (error) {
console.log('init connection error: ' + error)
}
}
3 Replies
TonyLikeSocks
TonyLikeSocksOP•15mo ago
I've isolated the issue to the react-native code. I can successfully connect to the phoenix socket using curl.
Unknown User
Unknown User•15mo ago
Message Not Public
Sign In & Join Server To View
TonyLikeSocks
TonyLikeSocksOP•15mo ago
I did swap to HTTP, and also changed my approach to follow the provider from the example. I think I was also awaiting the result when I didn't need to. I have it working now, though my disconnect calls aren't working 🙂 I opened a github issue https://github.com/jellyfish-dev/react-native-membrane-webrtc/issues/139
GitHub
Disconnect not firing · Issue #139 · jellyfish-dev/react-native-mem...
I'm having trouble with the disconnect function. It doesn't appear to be successfully disconnecting from my membrane webrtc server. This is my disconnect function which I attach to the prov...
Want results from more Discord servers?
Add your server