javascript - 当我发送带有图像的发布请求时得到这个:错误:请求失败,状态码 409
问题描述
当我发送没有图像的发布请求时,一切正常。当我添加图像时,它似乎失败了。我收到一个错误:请求失败,状态码为 409。这是我的反应表单页面的代码。
const Form = ({ currentId, setCurrentId }) => {
const [postData, setPostData] = useState({
creator: '', title: '', message: '', tags:'', selectedFiles:''
})
const post = useSelector((state) => currentId ? state.posts.find((p) => p._id === currentId) : null);
const classes = useStyles();
const dispatch = useDispatch();
useEffect(() => {
if(post) setPostData(post);
}, [post])
const handleSubmit = (e) => {
e.preventDefault();
if(currentId) {
dispatch(updatePost(currentId, postData));
} else {
dispatch(createPost(postData));
}
//clear();
}
const clear = () => {
setCurrentId(0);
setPostData({creator: '', title: '', message: '', tags:'', selectedFiles:''})
}
return (
<Paper className={classes.paper}>
<form autoComplete='off' noValidate className={`${classes.root}${classes.form}`} onSubmit={handleSubmit}>
<Typography variant='h6'>{currentId ? 'Editing' : 'Creating' } a Store</Typography>
<TextField name='creator' variant='outlined' label='Creator' fullWidth value={postData.creator}onChange={(e) => setPostData({ ...postData, creator: e.target.value })}/>
<TextField
name='Store Name'
variant='outlined'
label='name'
fullWidth
value={postData.title}
onChange={(e) => setPostData({ ...postData, title: e.target.value })}
/>
<TextField
name='message'
variant='outlined'
label='message'
fullWidth
value={postData.message}
onChange={(e) => setPostData({ ...postData, message: e.target.value })}
/>
<TextField
name='crypto'
variant='outlined'
label='crypto'
fullWidth
value={postData.tags}
onChange={(e) => setPostData({ ...postData, tags: e.target.value })}
/>
<div className={classes.fileInput}>
<FileBase
type='file'
multiple={false}
onDone={(base64) => setPostData({ ...postData, selectedFile: base64})}
/>
</div>
<Button className={classes.buttonSubmit} variant="container" color="primary" size="large" type="submit" fullwidth>Submit</Button>
<Button variant="contained" color="secondary" size="small" onClick={clear} fullwidth>Clear</Button>
</form>
</Paper>
);
}
export default Form;
这是我的服务器端路由的功能。我在这里获取表单信息并将其发布到服务器。
export const createPost = async (req, res) => {
const { title, message, selectedFile, creator, tags } = req.body;
const newPostMessage = new PostMessage({ title, message, selectedFile, creator, tags })
try {
await newPostMessage.save();
res.status(201).json(newPostMessage );
} catch (error) {
res.status(409).json({ message: error.message });
}
}
这是我的 mongodb 模型。
import mongoose from 'mongoose';
const postSchema = mongoose.Schema({
title: String,
message: String,
creator: String,
tags: [String],
selectedFile: String,
likeCount: {
type: Number,
default: 0
},
createdAt: {
type: Date,
default: new Date()
},
})
const PostMessage = mongoose.model('PostMessage', postSchema);
export default PostMessage;
解决方案
您的 Mongo 模型已selectedFile
声明为字符串。您的前端正在发送一个 base64 编码的 jpeg 文件,Mongo 不知道如何将其转换为字符串。
查看这个问题,了解在 Mongo 中存储 jpeg 的一些线索。
推荐阅读
- postgresql - PL/pgSQL 错误:为 RAISE 指定的参数过多
- ionic-framework - Ionic 4 应用程序在浏览器中显示 api 数据,但在设备上它不显示 api 数据
- c# - 调用 JsonConvert.DeserializeObject() 时对象丢失数据
- ios - 如何在解码 JSON 内容时设置/复制 Struct 属性
- python - 如何在多页应用程序上使用 plotly-dash 下载文件?
- maven - Jenkins 无法执行 Maven 命令:“检查 scm 状态时发生错误。无法发现客户端”
- r - 高效匹配具有多个条件的列
- javascript - 如何将谷歌云存储 md5 哈希解码为由 Node JS 中的哈希生成器生成的字符串
- apache-spark - Spark 错误 - 达到批量解决的最大迭代次数 (100)
- python - 同时填充和重命名数据集