Connection Success or Error not emitted from iOS for the first time in iOS 14 and above

[itzsankar]

HI,

I'm trying to create a tcp connection to host in iOS, connection success or error not emitting in particular iOS versions with particular devices for the first time, but if trying to reconnect it is connected successfully,

Below are the Devices which are not connecting

Device	iOS version
XR	14 and above
7	14 and above
8	14 and above

Below are the Devices which are connecting successfully.

Device	iOS version
11	14 and above

All the devices are successfully connecting in iOS version below 14

Reproducing code:

const client = TcpSocket.createConnection({port: PORT, host: HOST, localAddress: ipAddress}, async () => {
        await wait(1500);
        const data = some json value;
        client.write(`${data}\n\n\n`);
      });

client.on('data', async uint8Array => {
});

client.on('close', async () => {
console.log('connection closed');
});

client.on('error', async () => {
console.log('Error', error);
                reject();
});

[Rapsssito]

@itzsankar, does this issue also occur with simulated devices?

[itzsankar]

@itzsankar, does this issue also occur with simulated devices? @Rapsssito no not possible through simulator, need real device to check

[Rapsssito]

@itzsankar, I am afraid I do not own any of those devices. Can you reproduce the issue with the simulator?

[itzsankar]

@Rapsssito , I have tried but wifi option is not enabling in simulator, do you know how to do it in simulator?

[Rapsssito]

@itzsankar, this library is about TCP, not WiFi. If your computer is connected to the network, your simulated device is also connected.

[itzsankar]

@Rapsssito , I'm able to reproduce it in simulator. I'm getting error response after Some time I'm getting error. But no success response .

[Rapsssito]

@itzsankar, could you provide the code you are using so I can reproduce the issue on my end?

[itzsankar]

This is the code I used to reproduce.

import React from 'react';
import {
    StyleSheet,
    Text,
    View,
} from 'react-native';
import TcpSocket from 'react-native-tcp-socket';

class App extends React.Component {
    constructor(props) {
        super(props);

        this.updateChatter = this.updateChatter.bind(this);
        this.state = { chatter: ['hello'] };
    }

    updateChatter(msg) {
        this.setState({
            chatter: this.state.chatter.concat([msg]),
        });
    }

    componentDidMount() {
        const serverPort = 53333;
        const serverHost = '192.1.1.3';
        let client;

        client = TcpSocket.createConnection({
            port: serverPort,
            host: serverHost,
        }, (address) => {
            this.updateChatter(`opened client on ${JSON.stringify(address)}`);
            client.write('Hello, server! Love, Client.');
        });

        client.on('connect', () => {
            this.updateChatter('Client connect');
            console.log('CONNECT');
        });

        client.on('timeout', () => {
            this.updateChatter('Client timeout');
            console.log('TIMEOUT');
        });

        client.on('data', (data) => {
            console.log('DATA');
            this.updateChatter(`Client Received: ${data}`);
        });

        client.on('error', (error) => {
            console.log('ERROR');
            this.updateChatter(`client error ${error}`);
        });

        client.on('close', () => {
            console.log('CLOSE');
            this.updateChatter('client close');
        });

        this.client = client;
    }

    componentWillUnmount() {
        this.client = null;
    }

    render() {
        return (
            <View style={styles.container}>
                {this.state.chatter.map((msg, index) => (
                    <Text key={index} style={styles.welcome}>
                        {msg}
                    </Text>
                ))}
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: 'red',
    },
    welcome: {
        fontSize: 20,
        textAlign: 'center',
        color: 'black',
        margin: 10,
    },
});

export default App;

[Rapsssito]

@itzsankar, what device simulator are you using and what is the problem and the expected output?

[itzsankar]

Simulator - Iphone 8 - iOS 14.1

client = TcpSocket.createConnection({
            port: serverPort,
            host: serverHost,
        }, (address) => {
            this.updateChatter(`opened client on ${JSON.stringify(address)}`);
            client.write('Hello, server! Love, Client.');
        });

i'm not getting any callbacks while creating connection, after 2 minutes i'm getting error.

[Rapsssito]

@itzsankar, it looks like your server might not be receiving your TCP request. Have you tested it from nodeJS for example?

[itzsankar]

@Rapsssito , after long research I reproduced the bug, for reproducing the bug you need a server running in a different machine in the same network. you will receive the apple local netowrk permission popup first time and it will not connect, 2nd time you will not receive pop up and it will connect to the server.

[Rapsssito]

@itzsankar, sorry for my late reply. I will test this ASAP.

[hongsa]

@Rapsssito I also found the same symptoms. Can't you control when the permission popup appears?