hyochan / react-native-audio-recorder-player

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

I would like to know if it is a problem with setting voice recording permission on Android or with the server upload method. #397

Open kchany opened 2 years ago

kchany commented 2 years 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.

If you are Korean, please let me know your e-mail for more detailed explanation and I would like to communicate in Korean.

Version of react-native-audio-recorder-player

3.1.2

Version of React Native

2.0.1

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

Android

Expected behavior

Upload recorded voice to server

Actual behavior

When you tap Voice Record, A notification asking to grant permission appears, and if you set allow, Error: Try again after adding permission. Error: recorder is null. The text appears.

After exiting the application and entering again and proceeding with recording, the voice recording is completed, and the recording path of Android is The log says "uri": "file:////data/user/0/com.baeuja/cache/sound.mp4".

And in the server, the mp4 file for the duration of the audio recording is stored, and the audio recording is not in progress, but it is an empty file.

In iOS, the desired function works normally.

As instructed in the manual, we have proceeded with all of the Android permission settings.

Steps to reproduce the behabior

Voice recording function.

const onStartRecord = async () => { console.log('-------------음성 녹음 시작-------------');

const recoredUserVoice = await audioRecorderPlayer.startRecorder();
audioRecorderPlayer.addRecordBackListener((e) => {
  return;
});
setIsRecordingUserVoice(!isRecordingUserVoice);

};

This is the part that stops voice recording and uploads it to the server. const onStopRecord = async () => { const DEFAULT_RECOREDED_FILE_NAME_iOS = 'sound.m4a'; const DEFAULT_RECOREDED_FILE_NAME_Android = 'sound.mp4'; const recoredUserVoice = await audioRecorderPlayer.stopRecorder(); audioRecorderPlayer.removeRecordBackListener(); if (recoredUserVoice === 'Already stopped') { alert('Please record your the great voice first 🙏'); console.log('Already stopped'); return; } setIsRecordingUserVoice(!isRecordingUserVoice); setIsMoreThanOneTimeRecord(true); console.log(recoredUserVoice); console.log('-------------음성 녹음 중지 완료------------');

try {
  const formData = new FormData();

  if (Platform.OS === 'ios') {
    formData.append(
      'userVoice', //업로드할 파일의 폼
      {
        uri: recoredUserVoice, //파일 경로
        type: 'audio/m4a', //파일 형식
        name: DEFAULT_RECOREDED_FILE_NAME_iOS, //파일 이름
      }
    );
    console.log(Platform.OS);
    console.log(formData);
    console.log(formData._parts[0][1]);
  } else if (Platform.OS === 'android') {
    formData.append(
      'userVoice', //업로드할 파일의 폼
      {
        uri: recoredUserVoice, //파일 경로
        type: 'audio/mpeg_4', //파일 형식
        name: DEFAULT_RECOREDED_FILE_NAME_Android, //파일 이름
      }
    );
    console.log(Platform.OS);
    console.log(formData);
    console.log(formData._parts[0][1]);
  }

  AsyncStorage.getItem('token', async (error, token) => {
    // try {
    if (token === null)
      if (error)
        // login으로 redirect
        // AsyncStorage error
        throw error;

    await axios
      .post(
        `https://api.k-peach.io/learning/sentences/${currentSentence.sentenceId}/userSentenceEvaluation`,
        formData,
        {
          headers: {
            Authorization: `Bearer ${token}`,
            'Content-Type': 'multipart/form-data',
          },
          data: formData,
        }
      )
      .then(({ data: { success, evaluatedSentence, pitchData, errorMessage } }) => {
        console.log(
          `score: ${evaluatedSentence.score} | evaluatedSentence: ${evaluatedSentence.sttResult}`
        );
        console.log(`pitchData : ${pitchData.userVoice}`);

        setEvaluatedSentence(evaluatedSentence);
        setPitchData(pitchData);

        if (!success) throw new Error(errorMessage);
        console.log(errorMessage);
        console.log('success getting Evaluated Data');
      })
      .catch((error) => {
        console.log(error);
      });

    //   if (tokenExpired) {
    //     // login으로 redirect
    //   }
  });
} catch (err) {
  console.log(errorMessage);
  //업로드 취소 error 표시
  if (DocumentPicker.isCancel(err)) {
  } else {
    throw err;
  }
}

};

manchi17 commented 2 years ago

Facing same issue

manchi17 commented 2 years ago

Try the following while startig the record function,

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; }