使用“ firebase-storage”和“ react-native-fetch-blob”,React Native图像上传不起作用

时间:2019-07-29 07:29:55

标签: firebase react-native firebase-storage image-uploading

我正在尝试在react-native中添加图像上传功能。我正在使用“ firebase-storage”,“ react-native-fetch-blob”和“ react-native-image-picker”。图片成功上传到“ firebase-storage”,但此后没有调用任何firebase方法。基本上,我试图在上传图片后更新Firestore“用户”集合中的图片路径,但不会更新任何内容。请检查下面的代码。我有什么需要更新的吗?

请在此GitHub Repo中找到该组件的完整代码: https://github.com/jaydeep-stackmaze/React-Native-Image-Upload/blob/master/edit_profile.js

 uploadImage(file) { 
        const Blob = RNFetchBlob.polyfill.Blob;
        const fs = RNFetchBlob.fs;
        window.XMLHttpRequest = RNFetchBlob.polyfill.XMLHttpRequest;
        window.Blob = Blob;
        let curUser = firebase.auth().currentUser;

        if (curUser) {
            let curUserId = curUser.uid;

            let uploadBlob = null;
            const imageRef = firebase.storage().ref().child('profile_images/' + curUserId + '.jpg');
            let mime = 'image/jpg';

            fs.readFile(file.uri, 'base64')
                .then((data) => {
                    console.log('File read');
                    return Blob.build(data, { type: `${mime};BASE64` });
                })
                .then((blob) => {
                    console.log('uploading...');
                    uploadBlob = blob;
                    imageRef.put(blob, { contentType: mime })
                    .then(() => {
                        uploadBlob.close();
                        console.log('Getting url...');
                        imageRef.getDownloadURL()
                        .then((url) => {
                            console.log(url);
                            firebase.firestore().collection('users').doc(curUserId).update({
                                profile_image_url: url
                            });
                            console.log('Image updated');
                        });
                    }).catch((error) => {
                        console.log(error);
                    });                    
                })
                .catch((error) => {
                    console.log(error);
                });
        } else {
            alert('Please login...!');
        }       
    }

    changeProfilePhoto() {
        const options = {
            title: 'Select Avatar',
            storageOptions: {
              skipBackup: true,
              path: 'images',
            },
        };

        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 {
                console.log("response :", response);
                this.uploadImage(response);
            }
        });
    }

此代码不会引发任何错误。只是将图像上传到Firebase存储中之后,firebase方法没有被调用。

0 个答案:

没有答案