Error while making POST request to change user password - node.js

Question

when i try changing password using postman everything works but when i try to do that on the frontend i don't get any errors on the backend, the password isn't changed and i get error on network tab 'id is not valid'.
here is my backend:
routes:
router.post("/reset", reset);
router.post("/reset/:userId/:token", changepw);
controllers:
export const reset = async (req, res) => {
const { email } = req.body;
try {
if (validateEmail(email) === false)
return res.status(400).json({ error: "Please enter a valid email" });
const user = await User.findOne({ email });
if (!user) return res.status(404).json({ error: "User doesn't exist" });
let token = await Token.findOne({ userId: user._id });
if (!token) {
token = await new Token({
userId: user._id,
token: crypto.randomBytes(32).toString("hex"),
}).save();
}
const link = `http://localhost:3000/auth/reset/${user._id}/${token.token}`;
// when the port is 5000 here its works on postman but when i set 3000 it doesn't work
const result = await sendEmail(user.email, link);
res.status(200).json({ result, token });
} catch (error) {
res.status(500).json({ error: "Something went wrong" });
console.log(error);
}
};
export const changepw = async (req, res, next) => {
const { password, confirmPassword } = req.body;
const { userId: _id, token } = req.params;
try {
if (!mongoose.Types.ObjectId.isValid(_id))
return res.status(400).json({ error: "Id is not valid" });
const user = await User.findById(_id);
if (!user)
return res.status(400).json({ error: "Invalid link or expired" });
const tokens = await Token.findOne({
userId: user._id,
token,
});
if (!tokens)
return res.status(400).json({ error: "Invalid link or expired" });
if (password !== confirmPassword)
return res.status(400).json({ error: "Passwords don't match" });
const hashedPassword = await bcrypt.hash(password, 12);
const result = await User.findByIdAndUpdate(
_id,
{ password: hashedPassword },
{ new: true }
);
await tokens.delete();
res.status(200).json({ result, tokens });
} catch (error) {
res.status(500).json({ error: "Something went wrong" });
console.log(error);
next(error);
}
};
here is the frontend:
this is how i connect backend and frontend:
export const reset = (email) => API.post("/auth/reset", email);
export const changepw = (pw) => API.post("/auth/reset/:userId/:token", pw);
<Route path="/auth/reset/:userId/:token" component={ChangePassword} />
// this the component where user go to change password
redux actions:
export const reset = (email) => async (dispatch) => {
try {
const { data } = await api.reset(email);
dispatch({ type: actionTypes.RESET, data });
} catch (error) {
const err = JSON.stringify(error?.response?.data);
sessionStorage.setItem("error", err);
}
};
export const changepw = (pw) => async (dispatch) => {
try {
const { data } = await api.changepw(pw);
dispatch({ type: actionTypes.CHANGEPW, data });
} catch (error) {
const err = JSON.stringify(error?.response?.data);
sessionStorage.setItem("error", err);
}
};
reducers:
export default (state = { user: null, link: null }, action) => {
switch (action.type) {
case actionTypes.RESET:
return { ...state, link: action.payload };
case actionTypes.CHANGEPW:
return { ...state, user: [state.user, action.payload] };
default:
return state;
}
};
this is what i do when user submit new password:
const [data, setData] = useState({
password: "",
confirmPassword: "",
});
const handleSubmit = async (e) => {
e.preventDefault();
dispatch(changepw({ ...data }));
setData({
password: "",
confirmPassword: "",
});
// history.push("/auth");
};