使用 react-base64 上传图片时发生 postMessage 验证失败错误答案

【问题标题】：postMessage validation failed error occurring during image upload using react-base64使用 react-base64 上传图片时发生 postMessage 验证失败错误
【发布时间】：2022-10-13 00:55:18
【问题描述】：

我正在上传图像并将其保存到 mongodb，但它显示以下错误：

消息：“postMessage 验证失败：selectedFile：Cast

名称：“验证错误”

_message: "postMessage 验证失败"

我在前端使用 react-base64 来上传图片。

&lt;FileBase type="file" multiple={false} onDone={(base64) =&gt; setPostData({ ...postData, selectedFile: base64})} /&gt;

我正在通过 fetch 将它添加到数据库中：

let handleSubmit = (event) => {
        event.preventDefault();
        console.log(postData);
        fetch(`http://localhost:5000/posts/create`, {
            method: 'POST',
            mode: 'cors',
            headers: {
                'Content-Type': 'application/json',
                // 'Accept': 'application/json'
            },
            body: JSON.stringify(postData),
        })
        .then(response => response.json())
        .then((dataFromServer) => {
            console.info(dataFromServer);
        })
        .catch(error => console.error(error));

    }

谁能告诉我我做错了什么，我该如何解决这个问题

【问题讨论】：

标签： javascript node.js reactjs mongodb base64

【解决方案1】：

在 FileBase 组件中，您需要这样做。

您需要解构onDone 上的参数。这样onDone={({base64}) => yourFunction()}

你可以用这个。

<FileBase type="file" multiple={false} onDone={({base64}) => setPostData({ ...postData, selectedFile: base64})} />

【讨论】：

谢谢你，小伙伴。我能够解决这个问题。

【解决方案2】：

您好，所以我尝试做同样的事情，但现在我的猫鼬模型似乎不再具有“selectedFile”属性。

【讨论】：