MediaSoup Client: does I need to close transport and create new one when switching network connection

Question

When user network connection problem occur (lost socket connection and reconnect) then I close current transport and all producer, consumer. Then re-create again.

    public async loadTransport(skipConsume: boolean = false): Promise<void> {
        let routerRtpCapabilities: mediasoupClient.types.RtpCapabilities
            = await this.socketService.sendRequest('getRouterRtpCapabilities', null);

        routerRtpCapabilities.headerExtensions = routerRtpCapabilities.headerExtensions
            .filter((ext) => ext.uri !== 'urn:3gpp:video-orientation');

        if (!this.mediasoupDevice.loaded) {
            await this.mediasoupDevice.load({ routerRtpCapabilities });
        }

        this.resetRoomTransports();
        await Promise.all([
            this.createProducerTransport(),
            this.createConsumerTransport()
        ]).then(() => {
            // console.log("@ create producer/consumer transport: DONE");    
        });
        // console.log("@ load transport: DONE");
    }

and

    public resetRoomTransports(): void {
        if (this._sendRestartIce && this._sendRestartIce.timer) clearTimeout(this._sendRestartIce.timer);
        if (this._recvRestartIce && this._recvRestartIce.timer) clearTimeout(this._recvRestartIce.timer);

        if (this.audioTransport.getValue()) {
            this.latencyService.unSubscribe("audio", this.audioTransport.getValue());
        }
        
        if (this.producerVideo) {
            this.producerVideo.close();
            this.producerVideo = null;
            this.localParticipantService.updateLocalProducer('', 'webcam');
        }

        if (this.producerAudio) {
            this.producerAudio.close();
            this.producerAudio = null;
            this.localParticipantService.updateLocalProducer('','audio');
        }

        try {
            if (this.producerTransport) {
                this.producerTransport.close();
                this.producerTransport = null;
            }

            if (this.consumerTransport) {
                this.consumerTransport.close();
                this.consumerTransport = null;
            }
        } catch(error) {
            this.producerTransport = null;
            this.consumerTransport = null;
        }
    }

And then, I got Error: enter image description here

Can I reuse old media stream (transport, consumer, producer) when I switch network, reconnect socket? Or, is there anyway to fix error log above?

Answer 1

Can I reuse old media stream (transport, consumer, producer) when I switch network, reconnect socket? Or, is there anyway to fix error log above?

It depends, if the connectionState on each transport is failed then you can just do transport.restartIce() with appropriate params in the client and server side. If it's successful then you can continue using previously created transports/producers/consumers.

Otherwise, you'll have to close old transports, producers etc, and do the whole connection procedure again.

As per your code, it looks fine. From the screenshot, the error seems to be coming from transport.close(). Can you tell what mediasoup-client version you're using? and if possible a working demo of this would be helpful.

Note: Socket connection is different from RTP connection to your SFU. They are not always translatable 1:1 in their connection state. It's possible to have a mismatch depending on the timeout set for socket service in the backend. But as a good thumb of rule, if your socket gets timeout or connectionState on the transport changes to failed then closing old transports etc, and reinitializing the connection process works.