Firebase上载进度从snapshot.bytesTransferred / snapshot.totalBytes超过100

问题描述 投票:0回答:1

过去一直很好,直到最近。

[上传文件时,我正在跟踪这样的上传进度:

        uploadImage = uri => {
            const image = Platform.OS === 'ios' ? uri.replace('file://', '') : uri;
            const Blob = RNFetchBlob.polyfill.Blob;
            const fs = RNFetchBlob.fs;
            window.XMLHttpRequest = RNFetchBlob.polyfill.XMLHttpRequest;
            window.Blob = Blob;

            let uploadBlob = null;

            const imageRef = firebase
            .storage()
            .ref('categories/')
            .child(`${this.props.userData.uid}`)
            .child(`${this.state.img}`);

            const mime = this.state.isVideo ? 'video/mp4' : 'image/jpg';

            fs.readFile(image, 'base64')
            .then(data => {
                return Blob.build(data, {type: `${mime};BASE64`});
            })
            .then(blob => {
                uploadBlob = blob;
                this.uploadTask = imageRef.put(blob, {contentType: mime});

                this.uploadTask.on(
                'state_changed',
                snapshot => {
                    // Observe state change events such as progress, pause, and resume
                    // Get task progress, including the number of bytes uploaded and the total number of bytes to be uploaded
                    const progress =
                    (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
                    LayoutAnimation.easeInEaseOut();
                    this.setState({ uploadProgress: progress });
                    console.log(`Upload is ${progress}% done`);
                    switch (snapshot.state) {
                    case firebase.storage.TaskState.PAUSED: // or 'paused'
                        console.log('Upload is paused');
                        break;
                    case firebase.storage.TaskState.RUNNING: // or 'running'
                        console.log('Upload is running');
                        break;
                    }
                },
                error => {
                    // Handle unsuccessful uploads

                },
                () => {
                    // Handle successful uploads on complete
                },
                );
            });
        };

这是我在组件中显示数字的方式:

<Text>          
  {Math.trunc(this.state.uploadProgress)}%  
 </Text>

我将数字设置为组件状态,然后将其显示给用户。由于某种原因,该数字最近超过了100,例如显示了38154017之类的大数字。

当我记录进度时,我可以看到哪里出错了:

 console.log(`Upload is ${progress}% done`);

 LOG  Upload is 0% done
 LOG  Upload is 38.15395542514653% done
 LOG  Upload is 38.15395542514653% done
 LOG  Upload is 38154017.271191105% done
 LOG  Upload is 100% done

由于某种原因,进度将第三对数乘以100?这只是大约一个月才发生的情况,经过研究人们似乎仍在这样做。

这里是bytesTransferred和totalBytes的日志:

console.log(snapshot.bytesTransferred);

LOG  bytesTransferred 0
LOG  bytesTransferred 0262144
LOG  bytesTransferred 262144
LOG  bytesTransferred 262144524288
LOG  bytesTransferred 786432
LOG  bytesTransferred 786432176078

console.log(snapshot.totalBytes);

LOG  totalBytes 962510
LOG  totalBytes 962510
LOG  totalBytes 962510
LOG  totalBytes 962510
LOG  totalBytes 962510
LOG  totalBytes 962510
LOG  totalBytes 962510

我不知道Firebase是否更改了某些内容,但是无论我希望听到人们的评论是什么!

干杯。

node.js reactjs firebase react-native firebase-storage
1个回答
0
投票

我知道这不是理想的方法,但可能的解决方法是,如果当前进度超过100,则仅根据当前进度添加一个数字,以使其流动并复制增加的上传任务...

这是我将用于临时解决方案的内容:

this.setState({ 
   uploadProgress: progress > 100 ? this.state.uploadProgress + 7 : progress 
});

我已经在firebase sdk上提交了错误报告,希望不久后会发布更好的答案...

© www.soinside.com 2019 - 2024. All rights reserved.