如何在 React Native 中将内部存储图像上传到服务器。图像未上传到服务器。在反应原生

时间:2021-03-25 08:49:42

标签: javascript react-native file-upload server digital-signature

我是本机反应的新手。我正在尝试上传存储在内部存储器中的数字签名图像。 路径是这样的 = '/storage/emulated/0/DCIM/1616657741752.png'。 但是图像没有上传然后认为问题出在这条路径上 - '/storage/emulated/0'。 因为在“/storage/emulated/0”这个路径中没有名为 DCIM 的文件夹。 所以我使用下面的代码删除了这个 - '/storage/emulated/0'

this.setState({base64: paths.split('/storage/emulated/0').pop()})

但还是同样的问题,我的图片没有上传到服务器。总的来说,我的图像在我的手机内部存储中的 DCIM 文件夹中可见。我现在不知道该怎么办。 这是我的代码

 base64:null,

_onSaveEvent = (result) => {
    this.checkAndroidPermission(result)
    }
    
    checkAndroidPermission = async (result) => {
    if (Platform.OS === 'ios') {
    save(result);
    } else {
    try {
    const granted = await PermissionsAndroid.request(
    PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
    );
    if (granted === PermissionsAndroid.RESULTS.GRANTED) {
    // Once user grant the permission start downloading
    
    this.save(result);
    } else {
    if (Platform.OS === 'android') {
    ToastAndroid.show('Storage Permission denied.', ToastAndroid.SHORT);
    } else {
    AlertIOS.alert('Storage Permission denied.');
    }
    }
    } catch (err) {
    // To handle permission related exception
    console.warn('tryerr', err);
    }
    }
    };
    
    save = async (result) => {
    const paths = `${
    RNFetchBlob.fs.dirs.DCIMDir
    }/${new Date().getTime()}.png`; // where u need to put that
    try {
    RNFetchBlob.fs
    .writeFile(paths, result.encoded, 'base64')//data.base64 is your photo with convert base64
    .then((value) => {
    RNFetchBlob.fs
    .scanFile([{path: paths}]) //after save to notify gallry for that
    .then(() => {
      this.setState({base64: paths.split('/storage/emulated/0').pop()})
    console.log('scan file success');
    console.log("this is fuckiiing file"+ this.state.base64)
    })
    .catch((err) => {
    console.log('scan file error');
    });
    })
    .catch((e) => console.log(e.message));
    } catch (error) {
    console.log('fileerror', error.message);
    }
    
    }


 
         formData.append('digital_signature',this.state.base64);

    console.log(JSON.stringify(formData))
    fetch('https://abc.tech/Android_API_CI/upload_multipart_data',
      {
        method: 'post',
          body : formData, 
          
        headers: {
          'Content-Type': 'multipart/form-data;',
        },



 <SignatureCapture
                              style={styles.signature}
                              ref="sign"
                              onSaveEvent={this._onSaveEvent}
                              onDragEvent={this._onDragEvent}
                              saveImageFileInExtStorage={true}
                              showNativeButtons={false}
                              showTitleLabel={false}
                              viewMode={'portrait'}
                            />

1 个答案:

答案 0 :(得分:1)

这是您的 Ans 并放入函数中,可能会有所帮助

const file = {
      uri:
        Platform.OS == 'android'
          ? '/storage/emulated/0/DCIM/1616657741752.png' //path to your file 
          : 'file:///storage/emulated/0/DCIM/1616657741752.png',
      name: 'sign.png', // which go on server on your file name
      type: 'image/png', // e.g. 'image/jpg'
    };
    

formData.append('digital_signature',file);

    console.log(JSON.stringify(formData))
    fetch('https://abc.tech/Android_API_CI/upload_multipart_data',
      {
        method: 'post',
          body : formData, 
          
        headers: {
          'Content-Type': 'multipart/form-data;',
        },