我收到“Firebase 存储：`put` 中的参数计数无效：预期在 1 到 2 个参数之间，收到 0答案

【问题标题】：i'm getting an error of "Firebase Storage: Invalid argument count in `put`: Expected between 1 and 2 arguments, received 0我收到“Firebase 存储：`put` 中的参数计数无效：预期在 1 到 2 个参数之间，收到 0
【发布时间】：2020-11-22 16:06:54
【问题描述】：

当我点击上传按钮时，firebase 给我以下错误：

未捕获的 FirebaseStorageError {code_: "storage/invalid-argument-count", message_: "Firebase 存储：put 中的参数计数无效：预期在 1 到 2 个参数之间，收到 0。"，serverResponse_：null，name_： “Firebase 错误”}

function ImageUpload(username) {
    const [caption, setCaption] = useState('');

    const [image, setImage] = useState(null);
    // const [url, setUrl] = useState("");
    const [progress, setProgress] = useState(0);

    const handleChange =  (e) => {
        if(e.target.files[0]){
            setImage(e.target.files[0]); // setting current image
        } 
    };

    const handleUpload = () => {
        const uploadTask = firebase.storage().ref(`images/${image.name}`).put();

        uploadTask.on(
            "state_changed",
            (snapshot) => {
                // progress bar
                const progress = Math.round(
                    (snapshot.bytesTransferred / snapshot.totalBytes) * 100
                );
                setProgress(progress);
            },
            (error) => {
                // err function
                console.log(error); 
                alert(error.message);
            },
            () => {
                storage
                .ref("images")
                .child(image.name)
                .getDownloadURL()
                .then(url => {
                    //upload img inside DB
                    db.collection("posts").add({
                        timestamp : firebase.firestore.FieldValue.serverTimestamp(),
                        caption : caption ,
                        imageUrl : url ,
                        username : username
                    });

                    setProgress(0);
                    setCaption('');
                    setImage(null);
                });
            }
        )
    }

    return (
        <div>

            <progress value={progress} max="100" />

            <input type="text" placeholder='enter a caption...' 
                onChange={event => setCaption(event.target.value)} value={caption} 
            />

            <input type="file" onChange={handleChange} />

            <Button className="imageUpload__button" onClick={handleUpload}>
                Upload
            </Button>
        </div>
    )
}

export default ImageUpload

【问题讨论】：

你试过答案了吗？

标签： javascript reactjs firebase firebase-storage

【解决方案1】：

根据文档：

put

put（数据：Blob | Uint8Array | ArrayBuffer，元数据？：UploadMetadata）：UploadTask 将数据上传到此引用的位置。

参数数据：斑点 | Uint8Array |数组缓冲区要上传的数据。

可选元数据：UploadMetadata 新上传对象的元数据。

返回 UploadTask

例如：

var file = ... // use the Blob or File API
ref.put(file).then(function(snapshot) {
  console.log('Uploaded a blob or file!');
});

https://firebase.google.com/docs/storage/web/upload-files

https://firebase.google.com/docs/reference/js/firebase.storage.Reference#put

因此，在您使用的put() 方法中，您需要使用File 或Blob

【讨论】：