Description
Hello Team,
I am a University Student and Working on My Dissertation, I was exploring some libraries to connect to RPi's local Node/Python server.
I am using python to publish a zeroconf service on local network on RPi 4 Model B
from zeroconf import ServiceInfo, Zeroconf
PORT=8080
zeroconf = Zeroconf()
wsInfo = ServiceInfo('_http._tcp.local.',
"myhost._http._tcp.local.",
PORT, 0, 0, {"random_key": "1234", "answer": "42"})
zeroconf.register_service(wsInfo)
import time
time.sleep(1000);After Registering this service, It is visible on the Bonjour Browser.
My Host is the service name.
but the same is not visible in the react native app using react-native-zeroconf.
React Native Code
/**
* Sample React Native App
* https://github.com/facebook/react-native
*
* @format
*/
import React, {useEffect} from 'react';
import {
SafeAreaView,
ScrollView,
StatusBar,
Text,
useColorScheme,
View,
} from 'react-native';
import Zeroconf from 'react-native-zeroconf';
import {Colors} from 'react-native/Libraries/NewAppScreen';
const zeroconf = new Zeroconf();
function App(): React.JSX.Element {
const isDarkMode = useColorScheme() === 'dark';
const backgroundStyle = {
backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
};
useEffect(() => {
const handleStart = () => console.log('The scan has started.');
const handleFound = name => console.log('Service found:', name);
const handleResolved = service => {
console.log('Service resolved:', service);
// setServices(prevServices => [...prevServices, service]);
};
const handleError = err => console.log('Error:', err);
const handleStop = () => console.log('The scan has stopped.');
zeroconf.on('start', handleStart);
zeroconf.on('found', handleFound);
zeroconf.on('resolved', handleResolved);
zeroconf.on('error', handleError);
zeroconf.on('stop', handleStop);
// Start the service scan
setTimeout(() => {
zeroconf.scan('http', 'tcp');
console.log('Started scanning...');
}, 1000);
// Cleanup on component unmount
return () => {
zeroconf.off('start', handleStart);
zeroconf.off('found', handleFound);
zeroconf.off('resolved', handleResolved);
zeroconf.off('error', handleError);
zeroconf.off('stop', handleStop);
zeroconf.stop();
};
}, []);
return (
<SafeAreaView style={backgroundStyle}>
<StatusBar
barStyle={isDarkMode ? 'light-content' : 'dark-content'}
backgroundColor={backgroundStyle.backgroundColor}
/>
<ScrollView
contentInsetAdjustmentBehavior="automatic"
style={backgroundStyle}>
<View>
<Text>My Better RN NETWORK</Text>
</View>
</ScrollView>
</SafeAreaView>
);
}
export default App;My WiFi Router's Services are visible in the console but not this one.
Can someone please help me making my zeroconf service discoverable in react native code....
The same is True with nodejs server usng 'bonjour' package.
I have added these permissions in AndroidManifest.xml
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.CHANGE_WIFI_MULTICAST_STATE" />@bdraco @PaarthShah @jstasiak @scop @dtantsur @andrewbonney @