Error shows up after some time in communication

[clementdevosmc]

Hello,

I'm getting this error after implementing your demo in my project on android :

The code below is how i've implemented the api but it's not very different from the Demo code..

` import React, {Component} from "react"; import {View, Dimensions, Platform,StatusBar} from 'react-native'; import {RTCView} from 'react-native-webrtc'; import {RkStyleSheet, RkText, RkButton, RkTextInput} from 'react-native-ui-kitten'; import Icon from 'react-native-vector-icons/FontAwesome';

require('../lib/apiRTC-React-3.14.min.debug'); const window = Dimensions.get('window');

export class ApiRTCView extends Component {

constructor(props) {
    super(props);

    this.state = {
        state: 'pending',
        localId: null,
        selfViewSrc: null,
        callId: null,
        incommingCallerId: null,
        remoteList: new Map(),
        distantCallerId: "821943"
    }

    React.onSessionReady = this._onSessionReady;
    //React.onSessionReady =() => this.setState({state:'callbackOK'});
    React.onUserMediaSuccess = this._onUserMediaSuccess;
    React.onConnectedUsersListUpdate = () => {};
    React.onRemoteStreamAdded = this._onRemoteStreamAdded;
    React.onIncomingCall = this._onIncomingCall;
    React.onHangup = this._onHangup;

}

componentDidMount() {
    //apiRTC initialization
    apiRTC.init({apiKey: 'myDemoApiKey'});

}

componentWillUnmount() {
    //apiRTC initialization
    apiRTC.disconnect();
}

_onSessionReady = () => {

    let sessionId = apiRTC.session.apiCCId;
    console.log('_onSessionReady :' + sessionId);
    this.webRTCClient = apiRTC.session.createWebRTCClient({});
    this.setState(
        {state: 'ready', localId: sessionId});
}

_onUserMediaSuccess = (type, detail) => {
    console.log('_onUserMediaSuccess - type = ', type);
    this.setState({selfViewSrc: detail.stream.toURL()});
}

_onRemoteStreamAdded = (type, detail) => {
    console.log('_onRemoteStreamAdded - type = ', type);
    this.setState(
        {remoteList: this.state.remoteList.set(this.state.callId, detail.stream.toURL())});
}

_onIncomingCall = (type, detail) =>  {
    console.log('_onIncomingCall - type = ', type);
    this.setState({incommingCallerId: detail.callerId});
};

_onHangup = (type, detail) => {
    console.log('_onHangup - type = ', type);
    console.log('_onHangup - detail = ', detail);
    this._manageHangup();
};

_hangup = () => {
    this.webRTCClient.hangUp();
    this._manageHangup();
}

_manageHangup = () => {
    const remoteList = this.state.remoteList;
    remoteList.delete(this.state.callId);
    this.setState({
        remoteList,
        selfViewSrc: undefined,
        callId: null
    });
}

_call = () => {
    if (!this.state.distantCallerId) {
        return;
    }
    const callId = this.webRTCClient.call(this.state.distantCallerId, {}, {mediaRoutingMode: true});
    this.setState({callId});
}

render() {
    return (
        <View style={styles.container}>
            <RkText>{this.state.state}</RkText>
            {this.renderPublisherID()}
            {this.renderRemoteViews()}
            {this.renderLocalView()}
            {this.renderCallButton()}
        </View>)
}

renderPublisherID() {
    if (this.state.localId) {
        return (<RkText>Your local id is {this.state.localId}</RkText>);
    }
    return null;
}

renderLocalView() {
    if (!this.state.selfViewSrc) return null;
    return <RTCView streamURL={this.state.selfViewSrc} style={styles.selfView}/>
}

renderRemoteViews() {
    return Array
        .from(this.state.remoteList.values())
        .map((value, index) => <RTCView key={index} streamURL={value} style={styles.remoteView}/>);

}

renderCallButton() {
    if (!this.state.callId) {
        return (<View style={styles.callBar}>
                <RkTextInput
                    onChangeText={(distantCallerId) => this.setState({distantCallerId})}
                    value={this.state.distantCallerId}
                    placeholder="Room n°"
                    style={styles.sendBox}/>
                <RkButton onPress={this._call} style={[styles.icon]}
                          rkType='success circle'>
                    <Icon name="phone" style={styles.callIcon}/>
                </RkButton>
            </View>
        );
    }
    else {
        return (
            <View style={styles.callBar}><RkButton onPress={this._hangup}
                                                   rkType='danger circle' style={[styles.icon]}>
                <Icon name="phone" style={[styles.callIcon, styles.hangupIcon]}/>
            </RkButton>
            </View>);
    }

}

}

`

Do you have any idea of what's going wrong?

[clementdevosmc]

I also have this problem on iOs, running on a real iPhone 6.

[FredLuart]

a patch will be available soon

[FredLuart]

I was not able to reproduce the issue but this should be corrected, please update your demo to use apiRTC-React-latest.min.debug.js instead of apiRTC-React-3.14.min.debug.js

[clementdevosmc]

I don't seem to get the error anymore. Thanks !