react native 图片上传

image.png

直接放弃其他方案,走前端接base64,后端把base64转成url返回给前端的路子.

选择图片控件

// 选择图片
  const selectPhotoTapped = () => {
    const options = {
      title: '选择图片',
      cancelButtonTitle: '取消',
      takePhotoButtonTitle: '拍照',
      chooseFromLibraryButtonTitle: '相册',
      mediaType: 'photo',
      allowsEditing: false,
      storageOptions: {
        skipBackup: true,
      },
    };
    ImagePicker.showImagePicker(options, response => {
      if (response.didCancel) {
        console.log('User cancelled image picker');
      } else if (response.error) {
        console.log('ImagePicker Error: ', response.error);
      } else if (response.customButton) {
        console.log('User tapped custom button: ', response.customButton);
      } else {
        let source = {uri: response.uri};
        console.log('response', response);
        setImgSource(source);
        console.log('path', response.path);
        // let fileObj = {
        //   //name: response.fileName || '营业执照.jpg',
        //   name: 'image.png' || 'image.jpg',
        //   //path: response.path,
        //   //type: response.type,
        //    type: 'multipart/form-data',
        //   uri: response.path,
        // }
        //uploadImg(response);
        upFile(response);
      }
    });
  };

图片上传调用接口

let strBase = 'data:image/png;base64,'+fileObj.data;
  let tempData = {
    password: strBase,
    phone: '1'
  }

fetch('http://192.168.',{
   // fetch('http://132.',{
      method:'POST',
      headers:{
         "content-Type":"application/json",
        //'Content-Type': 'multipart/form-data;' + ' boundary=' + new Date().getTime() + `_djsaldjsajdlsadjslj`
      },
      //body:formData,
      body: JSON.stringify(tempData)
    })
      .then((response) => {
        console.log('response上传图片', response);
        response.text()
      })
      .then((responseData)=>{
        Alert.alert('111111111111');
        Alert.alert(responseData.url);
        console.log('responseData=',responseData);
      })
      .catch((error)=>{
        console.error('error',error)
      });