1

ユーザーが画像を Firebase Real-time データベースにアップロードできるようにしようとしています。「rn-fetch-blob」と「react-native-fetch-blob」の両方を使用しましたが、機能しませんでした。

写真は、アバター状態に保存するこの関数を介して選択されます。

selectPhoto() {
    const options = {
      quality: 1.0,
      maxWidth: 500,
      maxHeight: 500,
      storageOptions: {
        skipBackup: true
      }
    };
    ImagePicker.showImagePicker(options, (response) => {
      if (response.didCancel) {
        console.log('User cancelled photo 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 };
        this.setState({ avatar: source });
      }
    })
  }

次に、uploadPhoto はそれを Firebase にアップロードしようとしますが、「RNFetchBlob.fs.readFile」行で「引数「パス」がありません」というエラーが表示されます。

uploadPhoto(mime = 'application/octet-stream') {
    return new Promise((resolve, reject) => {
      const uploadUri = this.state.avatar;
      let uploadBlob = null
      console.log('uid' + this.state.uid);
      const imageRef = firebase.storage().ref('applicants' + this.state.uid).child('profile_pic');

      console.log(this.state.avatar);
      RNFetchBlob.fs.readFile(this.state.avatar, 'base64')
        .then((data) => {
          return Blob.build(data, { type: `${mime};BASE64` })
        })
        .then((blob) => {
          uploadBlob = blob
          return imageRef.put(blob_ref, blob, { contentType: mime })
        })
        .then(() => {
          uploadBlob.close()
          return imageRef.getDownloadURL()
        })
        .then((url) => {
          resolve(url)
        })
        .catch((error) => {
          alert(error.message);
          reject(error);
      })
    })
  }
4

1 に答える 1

0

react-native-fetch-blob が維持されなくなったため、rn-fetch-blob を使用します。あなたのコードを見て、パスとなるファイル名を指定していないと思います。ファイルシステムに保存された png から FormData/Blob を作成する方法の例を次に示します。

imageToFormData(filename: string): FormData {
    const data = new FormData();
    data.append('file', { uri: `file://${directory}/${filename}`, name: filename, type: 'image/png' });

    return data;
  }

したがって、コードで上記または次のようにブロブを構築してみてください。

.then((data) => {
          return Blob.build(data, { name: ${filename}, type: `${mime};BASE64` })
        })
于 2019-03-18T19:38:15.103 に答える