如何将音频剪辑从 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)

  })