When user kills the app, the 2nd user screen freezes and takes too much time to be aware of the connection disconnect

[elie-chaaban]

Please post usage questions or broader discussions on StackOverflow.

---

For feature requests, please fill out the feature request template

---

For bug reports, please fill out the bug report issue template

[rhainer]

How much time do you consider too much time and why? Keeping the 2nd user around for a while makes for a cleaner reconnection experience should the first user come back to the session.

[elie-chaaban]

It takes more than 40 seconds which is too much no?

[elie-chaaban]

okay makes sense but how can I show the user is disconnected? sessionDisconnected is fired even if stream is destroyed or session is destroyed

[elie-chaaban]

@rhainer let me know plz

[ticovix]

I'm the same issue. Moreover, I receive "streamDestroy" that breaks the publisher of the second user.

[vona-ben]

Hi @ticovix @elie-chaaban, Related to: https://github.com/opentok/opentok-react-native/issues/686 Which version are you using? We have deployed a fix in 2.26.0 regarding socket disconnection.

[elie-chaaban]

I m u sing the latest

[elie-chaaban]

I want to have like an event to show the other user that the user is disconnected.

The freeze btw only happens if I kill the app directly

[vona-ben]

Actually, that's expected. We have a reconnection feature. If you don't leave the session properly by calling session.disconnect method before leaving the session, the connection will be destroyed only after 30 seconds. This delay is in place in case the user reconnects to the session during that time.

[elie-chaaban]

Yeah I don't call this at all, how can I show the user that the other is disconnected and stop the video freeze. If I use session disconnected, this event is even called when I end the call after stream destoyed or session destroyed.

On whatsapp when I kill the app, the other has the call directly disconnected. I dont mind the 30 secs if I can catch this to show the user

[cnx-caiobarroso]

@elie-chaaban are you using version 2.26.0+ ? I'm using 2.25.2 and my crashlytics logs shows a bunch of connection error related crashes..

[cnx-caiobarroso]

@vona-ben does the 2.26.X versions fix this connection error?

otk_peer_connection_manager::collect_garbage()

[elie-chaaban]

I use the latest release

[je7ov]

@vona-ben I'm not seeing session.disconnect anywhere in the docs for react-native SDK https://www.tokbox.com/developer/sdks/react-native/reference/OTSession.html

The only reference I see to disconnecting is this

To disconnect the session, unmount the OTSession component

but just unmounting and disconnecting this way causes the other user to see a frozen frame for way too long. Is there a way to explicitly disconnect from the session with react-native? I see all the other SDKs in the docs have disconnect functions available.

[je7ov]

Hi, is there an update on this?

[jeffswartz]

Using the latest version of the SDK (opentok-react-native 2.28.3), I cannot reproduce this bug. I when I mount and unmount the OTSession component, I see the published stream and the connection go away in other connected clients. Here is my code:

/* eslint-disable react-native/no-inline-styles */
import React, {Component} from 'react';
import {View, Button} from 'react-native';
import {OTSession, OTPublisher, OTSubscriber} from 'opentok-react-native';

class App extends Component {
  constructor(props) {
    super(props);
    this.apiKey = 'your-api-key';
    this.sessionId = 'your-session-id';
    this.token = 'your-token';
    this.state = {connect: true};
    this.toggleState = () => {
      console.log('connected', this.state.connect);
      this.setState(prevState => ({connect: !prevState.connect}));
    };
  }

  render() {
    return (
      <View
        style={{
          flex: 1,
          flexDirection: 'column',
          paddingHorizontal: 100,
          paddingVertical: 50,
        }}>
        {this.state.connect && (
          <OTSession
            apiKey={this.apiKey}
            sessionId={this.sessionId}
            token={this.token}>
            <OTPublisher
              style={{width: 200, height: 200}}
              properties={{
                publishAudio: false,
              }}
            />
            <OTSubscriber style={{width: 200, height: 200}} />
          </OTSession>
        )}
        <Button onPress={this.toggleState} title="Toggle connect" />
      </View>
    );
  }
}

export default App;

Does this problem persist in v2.28.3+ for you? If so, can you post some (simple) sample code? Thanks