使用fetch blob和image picker对本机上传视频做出反应

Question

获取具有反应原生图像选择器的路径视频文件：

ui.draggable.clone().find("i").remove();

使用wrap：

发送带有react native fetch blob的文件

{path: "/storage/emulated/0/DCIM/Camera/VID_20171123_122202.mp4", uri: 
"content://media/external/video/media/50"}

不在服务器中返回视频数据：

     let url=CounterStore.base_url+'upload/video?
    &api_token='+CounterStore.api_token;
        RNFetchBlob.fetch('POST', url, {
            'Content-Type' : 'multipart/form-data',
        }, [

    // part file from storage
    { name : 'avatar-foo', filename : 'avatar-foo.png', 
    type:'image/foo', data: RNFetchBlob.wrap(this.state.data.path)},
    // elements without property `filename` will be sent as plain text
   { name : 'name', data : 'user'},
    { name : 'info', data : JSON.stringify({
     mail : 'example@example.com',
     tel : '12345678'
            })},
        ]).then((resp) => {
            console.log(resp)
        }).catch((err) => {
            console.log(err)
        })

avator-foo是空的。为什么？

Answer 1

您的代码存在三个问题......

1. 文件格式应为mp4，您的文件名为.png扩展名。
2. 包裹uri而不是路径。
3. 无需在有效负载中指定类型。

检查下面给出的例子

＆＃13;
＆＃13;
  ImagePicker.showImagePicker(options, (response) => {

            if (response.didCancel) {
            }
            else if (response.error) {
            }
            else if (response.customButton) {
            }
            else {
                let source = { uri: response.uri }
                RNFetchBlob.fetch('POST', URL, {
                    // dropbox upload headers
                    ...
                    'Content-Type': 'multipart/form-data',
                    // Change BASE64 encoded data to a file path with prefix `RNFetchBlob-file://`.
                    // Or simply wrap the file path with RNFetchBlob.wrap().
                }, [
                        // element with property `filename` will be transformed into `file` in form data

                        { name: 'file', filename: 'vid.mp4', data: RNFetchBlob.wrap(response.uri) },
                        // custom content type

                    ]).then((res) => {

                    })
                    .catch((err) => {
                        // error handling ..
                    })
                this.setState({
                    avatarSource: source
                });
               ....
            }
        });
＆＃13;
＆＃13;
＆＃13;