如何將react-native中的audiopath轉換成音頻文件，發送到node.js

Question

我想將音頻 wav 文件從我的 react-native 應用程序發送到 multipart/form-data 請求中的 postnodejs/express 路由。

使用https://github.com/goodatlas/react-native-audio-record package。我得到了我錄制的音頻文件的路徑

audioFile = await AudioRecord.stop();
console.log(audioFile);

/*
this is what i get
/data/user/0/com.docassistant/files/test.wav
*/

//STUCK HERE AT THIS LOGIC //我需要將此路徑轉換為文件並按如下方式發送

let file = new File([blob], `test.wav`, {
      type: "audio/wav"
});
const formData = new FormData();
formData.append("file", file);

axios
.post(`http://192.168.0.104:8081/postAudio`, formData, {
    headers: {
          "Content-Type": "multipart/form-data"
     }
})
.then(response => {
     console.log(response);
})
.catch(error => {
        console.log(error);
});

此外，我嘗試使用rn-fetch-blob發送 blob，但收到了錯誤的請求錯誤。

這是我在 nodejs 的 postrequest。 適用於postman 。

//Route.js
app.post('/postAudio', (req, res) => {

    const form = new multiparty.Form()
    form.parse(req, (error, fields, files) => {
        if (error) throw new Error(error);
        try {
            const path = files.file[0].path;
            const buffer = Fs.readFileSync(path);
            ....
            ....
            ....

Answer 1

您需要將文件路徑音頻轉換為 base64。並將 base64 發送到 api，在后端它將編碼為音頻文件

導入並安裝 RNFetchBlob

從 'rn-fetch-blob' 導入 RNFetchBlob

const onStopRecord = async () => {
    const result = await audioRecorderPlayer.stopRecorder();
    audioRecorderPlayer.removeRecordBackListener();
    setRecordSecs(0)
    console.log(result);
    RNFetchBlob.fs.readFile(result, 'base64')
        .then((data) => {
            console.log(data, 'fire')
            setVoice(data)
        })
}