hyochan / react-native-audio-recorder-player

react-native native module for audio recorder and player.
MIT License
715 stars 213 forks source link

Why my recorded file in iOS is not Uploading to backend #525

Open MiteshIts opened 1 year ago

MiteshIts commented 1 year ago

Please fill the template to help you out. Also, please try the Example project compare before submiting the issue when you have certain issue with your project setup.

Version of react-native-audio-recorder-player

Version of React Native

Platforms you faced the error (IOS or Android or both?). iOS

Expected behavior. Not working

Actual behavior

Steps to reproduce the behabior

const audioSet = {
  AudioEncoderAndroid: AudioEncoderAndroidType.AAC,
  AudioSourceAndroid: AudioSourceAndroidType.MIC,
  OutputFormatAndroid: OutputFormatAndroidType.AAC_ADTS,
  // AVEncoderAudioQualityKeyIOS: AVEncoderAudioQualityIOSType.low,

  // AVFormatIDKeyIOS: AVEncodingOption.alac,
  // AVSampleRateKeyIOS: 1200,
  // AVModeIOS: AVModeIOSOption.spokenaudio,

  // AVLinearPCMIsBigEndianKeyIOS: boolean,
  // AVLinearPCMIsFloatKeyIOS: boolean,
  // AVLinearPCMIsNonInterleavedIOS: boolean,

  // AVModeIOS: AVModeIOSOption.measurement,
  AVEncoderAudioQualityKeyIOS: AVEncoderAudioQualityIOSType.low,
  AVNumberOfChannelsKeyIOS: 2,
  AVFormatIDKeyIOS: AVEncodingOption.ulaw,
  AVSampleRateKeyIOS:44100

};

File Type :    fileName:isIOS ?'audio.wav' :'audio.mp3',

Also not working 

  AVFormatIDKeyIOS: AVEncodingOption.ulaw,
  OR
  AVFormatIDKeyIOS: AVEncodingOption.aac,
MiteshIts commented 1 year ago

The Same thing is Working in Android fileName:isIOS ?'audio.wav' :'audio.mp3',

AVFormatIDKeyIOS: AVEncodingOption.ulaw,

data.append("attFile", {
  uri: myFile.uri,
  type: getContentType(myFile.uri),
  // type: "audio/mpeg",
  name:this.state.fileName
});
shahjahanpak commented 1 year ago

Here is my working onStartRecord and onStopRecord

  const [state, setState] = useState({
    recordSecs: 0,
    recordTime: '00:00:00',
    currentPositionSec: 0,
    currentDurationSec: 0,
    duration: '00:00:00',
  });

  const dirs = ReactNativeBlobUtil.fs.dirs;
  const fileName = `recording${Date.now()}.mp4`;

  let audioRecorderPlayer = useRef<AudioRecorderPlayer>(
    new AudioRecorderPlayer(),
  ).current;

  const onStartRecord = async (): Promise<void> => {
    if (audioRecorderPlayer) {
      if (Platform.OS === 'android') {
        try {
          const grants = await PermissionsAndroid.requestMultiple([
            PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
            PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
            PermissionsAndroid.PERMISSIONS.RECORD_AUDIO,
          ]);

          console.log('write external stroage', grants);

          if (
            grants['android.permission.WRITE_EXTERNAL_STORAGE'] ===
              PermissionsAndroid.RESULTS.GRANTED &&
            grants['android.permission.READ_EXTERNAL_STORAGE'] ===
              PermissionsAndroid.RESULTS.GRANTED &&
            grants['android.permission.RECORD_AUDIO'] ===
              PermissionsAndroid.RESULTS.GRANTED
          ) {
            console.log('permissions granted');
          } else {
            console.log('All required permissions not granted');

            return;
          }
        } catch (err) {
          console.warn(err);
          return;
        }
      }

      const audioSet: AudioSet = {
        AudioEncoderAndroid: AudioEncoderAndroidType.AAC,
        AudioSourceAndroid: AudioSourceAndroidType.MIC,
        AVEncoderAudioQualityKeyIOS: AVEncoderAudioQualityIOSType.high,
        AVNumberOfChannelsKeyIOS: 2,
        AVFormatIDKeyIOS: AVEncodingOption.aac,
        OutputFormatAndroid: OutputFormatAndroidType.AAC_ADTS,
      };

      const path = Platform.select({
        ios: fileName,
        android: dirs.CacheDir + fileName,
      });
      try {
        await audioRecorderPlayer.startRecorder(path, audioSet);

        audioRecorderPlayer.addRecordBackListener((e: RecordBackType) => {
          setState(prev => ({
            ...prev,
            recordSecs: e.currentPosition,
            recordTime:
              audioRecorderPlayer?.mmssss(Math.floor(e.currentPosition)) ??
              '00:00:00',
          }));
        });
        toggleIsRecording();
      } catch (error) {
        console.log('recording error', error);
      }
    }
  };

  const onStopRecord = async (): Promise<void> => {
    const result = await audioRecorderPlayer?.stopRecorder();
    audioRecorderPlayer?.removeRecordBackListener();
    setState(prev => ({...prev, recordSecs: 0}));
    toggleIsRecording();
    onFinish({
      uri: result,
      type: 'audio/mpeg',
      name: fileName,
    });
  };
zhekaqq commented 1 year ago

its problem with mp3 format on ios, use m4a instead, it work both on ios and android

swikars1 commented 1 year ago

specifying proper path worked @shahjahanpak thanks, I had to remove this line from above solution's audio set though: OutputFormatAndroid: OutputFormatAndroidType.AAC_ADTS,

ApexifyApps commented 10 months ago

does anyone solve this issue ?