react-native-dnssd

Getting started

$ npm install react-native-dnssd --save

Mostly automatic installation

$ react-native link react-native-dnssd

Manual installation

iOS

1. In XCode, in the project navigator, right click Libraries ➜ Add Files to [your project's name]
2. Go to node_modules ➜ react-native-dnssd and add RNDnssd.xcodeproj
3. In XCode, in the project navigator, select your project. Add libRNDnssd.a to your project's Build Phases ➜ Link Binary With Libraries
4. Run your project (Cmd+R)<

Android

1. Open up android/app/src/main/java/[...]/MainActivity.java

• Add import com.koperadev.RNDnssdPackage; to the imports at the top of the file
• Add new RNDnssdPackage() to the list returned by the getPackages() method

2. Append the following lines to android/settings.gradle:

   include ':react-native-dnssd'
   project(':react-native-dnssd').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-dnssd/android')
   

3. Insert the following lines inside the dependencies block in android/app/build.gradle:

    compile project(':react-native-dnssd')
   

Usage

import{DNSSD}from'react-native-dnssd';constfoundSub=DNSSD.addEventListener("serviceFound",(service)=>{console.log("Service Found",service);});constlostSub=DNSSD.addEventListener("serviceLost",(service)=>{console.log("Service Lost",service);});DNSSD.startSearch("airplay","tcp");setTimeout(()=>{DNSSD.stopSearch();foundSub.remove();lostSub.remove();},30000);

Example

import{DNSSD}from'react-native-dnssd';importReact,{Component}from'react';import{FlatList,Platform,SafeAreaView,StyleSheet,Text,View}from'react-native';import{DNSSD}from'react-native-dnssd';exportdefaultclassAppextendsComponent{constructor(props){super(props);this.state={services: [],};}componentDidMount(){this.serviceFoundSub=DNSSD.addEventListener("serviceFound",(service)=>{console.log("Service Found",service);constexisting=this.state.services.find((s)=>s.name===service.name);this.setState({services: existing
? this.state.services.map((s)=>s.name===service.name ? service : s)
: [...this.state.services,service],});});this.serviceLostSub=DNSSD.addEventListener("serviceLost",(service)=>{console.log("Service Lost",service);this.setState({services: this.state.services.filter((s)=>s.name!==service.name),});});DNSSD.startSearch("airplay","tcp");}componentWillUnmount(){this.serviceFoundSub.remove();this.serviceLostSub.remove();this.serviceResolvedSub.remove();DNSSD.stopSearch();}render(){const{ services }=this.state;return(<SafeAreaViewstyle={styles.container}><Viewstyle={styles.content}><Textstyle={styles.title}>Airplay Devices</Text><FlatListdata={services}keyExtractor={(service)=>`${service.name}.${service.type}${service.domain}`}renderItem={({item: service})=><Serviceservice={service}/>}style={styles.services}/></View></SafeAreaView>);}}constService=({ service })=><Viewstyle={styles.service}><Textstyle={styles.serviceName}>{service.name}</Text>{service.hostName!==undefined
? <Textstyle={styles.serviceHost}>{service.hostName}:{service.port}</Text>
: null}{Object.keys(service.txt||{}).map((key)=><Textkey={key}style={styles.serviceTxt}>{key}={service.txt[key]}</Text>)}</View>;conststyles=StyleSheet.create({container: {flex: 1,backgroundColor: '#f0faff',},content: {flex: 1,padding: 20,},title: {marginBottom: 20,fontSize: 28,},services: {flex: 1,},service: {paddingBottom: 10,},serviceName: {fontSize: 20,},serviceType: {color: '#aaaaaa',},serviceHost: {color: '#aaaaaa',},serviceTxt: {fontFamily: Platform.OS==='ios' ? 'Courier' : 'monospace'},});