我有一个很奇怪的问题,我已经用同样的方法做了一些表格,每件事都做得很好。我会试着给你一些代码:
后端路由器JS:
const express = require('express');
const { check } = require('express-validator');
const chatControllers = require('../controllers/chat-controllers');
const checkAuth = require('../middleware/check-auth');
const router = express.Router();
router.get('/', chatControllers.getChat);
router.use(checkAuth);
router.post(
'/',
[
check('message')
.not()
.isEmpty()
],
chatControllers.createChat
);
module.exports = router;
后端控制器JS:
const createChat = async (req, res, next) => {
const errors = validationResult(req);
if (!errors.isEmpty()) {
return next(
new HttpError('Invalid, please check your data.', 422)
);
}
const { message } = req.body;
const createdChat = new Chat({
message,
creator: req.userData.userId
});
let user;
try {
user = await User.findById(req.userData.userId);
} catch (err) {
const error = new HttpError(
'Creating message failed, please try again.',
500
);
return next(error);
}
if (!user) {
const error = new HttpError('Could not find user for provided id.', 404);
return next(error);
}
try {
const sess = await mongoose.startSession();
sess.startTransaction();
await createdChat.save({ session: sess });
} catch (err) {
const error = new HttpError(
'Creating message failed, please try again.',
500
);
return next(error);
}
res.status(201).json({ chat: createdChat });
};
和前端表单:
const Chat = () => {
const auth = useContext(AuthContext);
const { isLoading, error, sendRequest, clearError } = useHttpClient();
const [formState, inputHandler] = useForm(
{
message: {
value: '',
isValid: false
}
},
false
);
const chatSubmitHandler = async event => {
event.preventDefault();
try {
const formData = new FormData();
formData.append('message', formState.inputs.message.value);
await sendRequest('http://localhost:5000/api/chat', 'POST', formData, {
Authorization: 'Bearer ' + auth.token
});
} catch (err) {}
};
return (
<React.Fragment>
<Helmet>
<title></title>
</Helmet>
<ErrorModal error={error} onClear={clearError} />
<div className="container">
<h1>CHAT</h1>
<form className="chat-form" onSubmit={chatSubmitHandler}>
<Input
id="message"
element="input"
type="text"
label="Message"
validators={[VALIDATOR_REQUIRE()]}
errorText="Please enter message."
onInput={inputHandler}
/>
<Button type="submit" disabled={!formState.isValid}>
SEND
</Button>
</form>
<div className="chat-body overflow-auto">
message body
</div>
</div>
</React.Fragment>
);
};
export default Chat;
在app js中我已经需要聊天的路由,而且我还设置了头和体解析器,但是在其他页面上它非常奇怪,所有的工作都很好,但是在这里我无法检索req.body..。
@我甚至无法处理形成成功错误我得到:无效,请检查您的数据。我认为这个输入有问题,当我安慰。log请求时,我看到这个请求。body为空。。
在express server应用程序中需要某种请求有效载荷解析器中间件。解析器实际解析主体,并在
import bodyParser from 'body-parser';
// And then
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
但是如果您想使用多部分表单数据,那么您可以使用