[英]POST http://localhost:3000/api/auth/register 404 (Not Found)
So I have created a backend for register auth, In the Postman works fine, I am getting user to the mondoDb as well, we but when I try to create actual Auth on the localhost:3000/front end.所以我为注册身份验证创建了一个后端,在 Postman 工作正常,我也让用户访问 mondoDb,但是当我尝试在 localhost:3000/前端创建实际身份验证时。 In the console it gives me error.在控制台中它给了我错误。 xhr.js:177 POST http://localhost:3000/api/auth/register 404 (Not Found)
if someone could help me where would this kind of error appear. xhr.js:177 POST http://localhost:3000/api/auth/register 404 (Not Found)
如果有人可以帮助我,这种错误会出现在哪里。
controllers控制器
exports.register = async (req, res, next) => {
const { username, email, password } = req.body;
try {
const user = await User.create({
username,
email,
password,
});
sendToken(user, 200, res);
} catch (err) {
next(err);
}
};
Routes路线
const express=require('express');
const router = express.Router();
const {
register,
login,
resetPassword,
forgotPassword}= require('../controllers/auth')
router.route('/register').post(register);
router.route('/login').post(login);
router.route('/forgotpassword').post(forgotPassword);
router.route("/resetpassword/:resetToken").put(resetPassword);
module.exports= router;
Register登记
import { useState } from "react";
import axios from "axios";
import { Link } from "react-router-dom";
const Register = ({ history }) => {
const [username, setUsername] = useState("");
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const [confirmpassword, setConfirmPassword] = useState("");
const [error, setError] = useState("");
const registerHandler = async (e) => {
e.preventDefault();
const config = {
header: {
"Content-Type": "application/json",
},
};
if (password !== confirmpassword) {
setPassword("");
setConfirmPassword("");
setTimeout(() => {
setError("");
}, 5000);
return setError("Passwords do not match");
}
try {
const { data } = await axios.post(
"/api/auth/register",
{
username,
email,
password,
},
config
);
localStorage.setItem("authToken", data.token);
history.push("/");
} catch (error) {
setError(error.response.data.error);
setTimeout(() => {
setError("");
}, 5000);
}
};
return (
<div className="register-screen">
<form onSubmit={registerHandler} className="register-screen__form">
<h3 className="register-screen__title">Register</h3>
{error && <span className="error-message">{error}</span>}
<div className="form-group">
<label htmlFor="name">Username:</label>
<input
type="text"
required
id="name"
placeholder="Enter username"
value={username}
onChange={(e) => setUsername(e.target.value)}
/>
</div>
<div className="form-group">
<label htmlFor="email">Email:</label>
<input
type="email"
required
id="email"
placeholder="Email address"
value={email}
onChange={(e) => setEmail(e.target.value)}
/>
</div>
<div className="form-group">
<label htmlFor="password">Password:</label>
<input
type="password"
required
id="password"
autoComplete="true"
placeholder="Enter password"
value={password}
onChange={(e) => setPassword(e.target.value)}
/>
</div>
<div className="form-group">
<label htmlFor="confirmpassword">Confirm Password:</label>
<input
type="password"
required
id="confirmpassword"
autoComplete="true"
placeholder="Confirm password"
value={confirmpassword}
onChange={(e) => setConfirmPassword(e.target.value)}
/>
</div>
<button type="submit" className="btn btn-primary">
Register
</button>
<span className="register-screen__subtext">
Already have an account? <Link to="/login">Login</Link>
</span>
</form>
</div>
);
};
export default Register;
You are having a problem with CORS.您遇到了 CORS 的问题。 There's a package that can solve that.有一个 package 可以解决这个问题。
npm i cors
The package can be found in: https://www.npmjs.com/package/cors package 位于: https://www.npmjs.com/package/cors
For you to use it you just need to import it and use it as follow:要使用它,您只需要导入它并按如下方式使用它:
var cors = require('cors');
express.use(cors());
You can also customise it more following the documentation.您还可以按照文档对其进行更多自定义。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.