如何將音頻剪輯從 react-native 上傳到 php 后端？

Question

嘗試了許多 3rd 方庫，如 axios、fetch、fetch-blob，但沒有成功。 這段代碼包括我的 php 后端。 使用 rn v 0.39

將手機存儲中已存在的音頻剪輯上傳到服務器

文件路徑：AudioUtils.MusicDirectoryPath + '/test.aac' [可以訪問路徑，可以播放剪輯]

使用參考：/github.com/g6ling/react-native-uploader

服務器響應

“無法檢索 uri /storage/emulated/0/Music/test.aac 的文件”

權限

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />                                                    
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />  

反應原生代碼

const form= new FormData();

form.append('userfile', {
    uri:  AudioUtils.MusicDirectoryPath + '/test.aac',
    type: 'audio/aac', 
    name: 'userfile'
});

  let xhr = new XMLHttpRequest()
  xhr.open('post', `http://vidyarangam.com/next/upload_file`)
  xhr.send(form)
  xhr.onerror = function(e) {
  console.log('err', e)
 }
 xhr.onreadystatechange = function() {
 if(this.readyState === this.DONE) {
  console.log(this.response)
 }
}

代碼

function upload_file() {
    $droidinput = json_decode(file_get_contents('php://input'), true);
    $file = $droidinput['userfile']; // i have no idea how to upload it   
    $config['upload_path'] = 'uploads/';    
    $config['allowed_types'] = '*';  
    $config['max_filename'] = '255';  
    $config['encrypt_name'] = TRUE;   
    $config['max_size'] = '1024'; //1 MB
    $this->load->library('upload', $config);

    if (!$this->upload->do_upload('userfile')) {
        echo json_encode('status'=>'File upload error');       
    } else {
        echo json_encode('status'=>'File successfully uploaded');
    }          
}

Answer 1

使固定

使用的庫 - react-native-fetch-blob

代碼

    import RNFetchBlob from 'react-native-fetch-blob';

    let dirs = RNFetchBlob.fs.dirs;

    let path_to_a_file = dirs.DownloadDir + '/header_logo.png';

  RNFetchBlob.fetch('POST', 'http://192.168.43.236/upload.php', {
    Authorization : "Bearer access-token",
    otherHeader : "foo",
    'Content-Type' : 'multipart/form-data',
  }, [

    { name : 'header_logo', filename : 'header_logo.png', type:'image/foo', data:RNFetchBlob.wrap(path_to_a_file)},
  ]).then((resp) => {

    console.log(resp.text())

  }).catch((err) => {

    console.log(err)

  })