Custom Audio Track - React Native

You can pass a custom audio track for the participant's audio. Use it to add custom layers like background noise removal, echo cancellation, etc. on audio and send it to other participants.

note

This page uses the following asynchronous methods. Refer to their API reference for the errors each Promise may reject with, and handle these rejections appropriately based on your use case.

• unmuteMic()
• changeMic()

Creating a Custom Audio Track

• You can create an audio track using createMicrophoneAudioTrack() method of @videosdk.live/react-native-sdk.
• This method can be used to create audio track using different encoding parameters and noise cancellation configuration.
• The microphone opens when you call this method. This method does not ask the user for microphone access. Call requestPermission() of useMediaDevice() first, or the Promise rejects with ERROR_MICROPHONE_ACCESS_DENIED_OR_DISMISSED (3018).

Parameters

• encoderConfig:

  • type: String
  • required: false
  • default: speech_standard
  • Allowed values : speech_low_quality | speech_standard | music_standard | standard_stereo | high_quality | high_quality_stereo
  • It will be the encoder configuration you want to use for Audio Track.

• noiseConfig

  • Overrides the audio processing that encoderConfig turns on or off. A flag you leave out keeps the value that encoderConfig sets.

  • echoCancellation

    • type: boolean
    • required: false
    • If true echo cancellation will be turned on else it would be turned off.

  • autoGainControl

    • type: boolean
    • required: false
    • If true auto gain will be turned on else it would be turned off.

  • noiseSuppression

    • type: boolean
    • required: false
    • If true noise suppression will be turned on else it would be turned off.

createMicrophoneAudioTrack() also takes microphoneId. See Custom Tracks for every parameter.

Returns

• Promise<CustomStreamTrack>
  • If you do not publish it, call customTrack.stop() to close the microphone.

Example

import { createMicrophoneAudioTrack } from "@videosdk.live/react-native-sdk";

let customTrack = await createMicrophoneAudioTrack({
  encoderConfig: "high_quality",
  noiseConfig: {
    noiseSuppression: true,
    echoCancellation: true,
    autoGainControl: true,
  },
});

Using Custom Audio Track

Custom Track while initializing the room

If you are passing micEnabled: true in the config of RoomProvider and want to use custom tracks from start of the room, you can pass custom track in the config as shown below.

import { useEffect, useState } from "react";
import {
  Constants,
  createMicrophoneAudioTrack,
  RoomProvider,
  useMediaDevice,
} from "@videosdk.live/react-native-sdk";

function App() {
  const { requestPermission } = useMediaDevice();

  const getTrack = async () => {
    // Ask for access first: creating a track does not prompt the user
    await requestPermission(Constants.permission.AUDIO_AND_VIDEO);
    const track = await createMicrophoneAudioTrack({
      encoderConfig: "high_quality",
      noiseConfig: {
        noiseSuppression: true,
        echoCancellation: true,
        autoGainControl: true,
      },
    });
    setCustomTrack(track);
  };

  let [customTrack, setCustomTrack] = useState(null);

  useEffect(() => {
    getTrack();
  }, []);

  return (
    customTrack && (
      <RoomProvider
        config={{
          roomId,
          participantName: "Participant Name",
          micEnabled: true, //If true, it will use the passed custom track to turn mic on
          camEnabled: true,

          //Pass the custom audio track here
          customMicrophoneTrack: customTrack,
        }}
        token={token}
        joinWithoutUserInteraction={true}
      >
        <RoomView />
      </RoomProvider>
    )
  );
}

Custom Track with unmuteMic()

In order to switch tracks during the room, you have to pass the CustomStreamTrack in the unmuteMic() method of useRoom.

note

Make sure to call muteMic() before you pass a new track to unmuteMic(). While the mic is on, unmuteMic() rejects with ERROR_ALREADY_IN_REQUESTED_STATE (3054). To replace the track while the mic is on, pass it to changeMic().

import {
  createMicrophoneAudioTrack,
  useRoom,
} from "@videosdk.live/react-native-sdk";

let customTrack = await createMicrophoneAudioTrack({
  encoderConfig: "high_quality",
  noiseConfig: {
    noiseSuppression: true,
    echoCancellation: true,
    autoGainControl: true,
  },
});

const { unmuteMic, changeMic } = useRoom();

try {
  await unmuteMic(customTrack);
} catch (err) {
  console.error("unmuteMic failed:", err);
}

//or, while the mic is on

try {
  await changeMic(customTrack);
} catch (err) {
  console.error("changeMic failed:", err);
}