在重置密码反应前端出错,但在 api 请求中工作正常

问题描述

API 路由

router.post(
      "/reset-password/:token",[
        check("password","Please enter a password with 6 or more characters")
          .isLength({ min: 6 })
          .custom((value,{ req,loc,path }) => {
            if (value !== req.body.password2) {
              // throw error if passwords do not match
              throw new Error("Passwords don't match");
            } else {
              return value;
            }
          }),],async (req,res) => {
        const errors = validationResult(req);
        if (!errors.isEmpty()) {
          return res.status(400).json({ errors: errors.array() });
        }
        try {
          const user = await User.findOne({
            resetToken: req.params.token,resetTokenExpires: { $gt: Date.Now() },});
          if (!user) {
            return res
              .status(404)
              .json({ errors: [{ msg: "Session Expired please try again" }] });
          }
          bcrypt.genSalt(10,(err,salt) => {
            bcrypt.hash(req.body.password,salt,hash) => {
              if (err) throw err;
              const newPassword = hash;
              try {
                user.password = newPassword;
                
                user.save();
                res.json({ Msg: "Password changed" });
              } catch (error) {
                console.error(error);
                res.json({ Msg: "Server Error" });
              }
            });
          });
        } catch (error) {
          console.error(error);
          res.status(400).json({ Msg: "Server Error" });
        }
      }
    );

反应组件

const ResetPassword = ({ resetPassword,setAlert }) => {
  const [formData,setFormData] = useState({
    password: "",password2: "",});

  const { password,password2 } = formData;

  const onChange = (e) =>
    setFormData({ ...formData,[e.target.name]: e.target.value });

  const onSubmit = async (e) => {
    e.preventDefault();
    // if (password !== password2) {
    //   setAlert("Password's do not match","danger");
    // } else {
    resetPassword(formData);
    // }
  };

  return (
    <Fragment>
      <h1 className="centered-text">Reset Password</h1>
      <div className="vehicle-card">
        <form onSubmit={onSubmit}>
          <div className="form-floating mb-3">
            <input
              className="form-control"
              id="floatingInput"
              name="password"
              placeholder="Email Address"
              value={password}
              onChange={onChange}
            />
            <label htmlFor="floatingInput">Email Address</label>
          </div>
          <div className="form-floating mb-3">
            <input
              className="form-control"
              id="floatingInput"
              name="password2"
              placeholder="Email Address"
              value={password2}
              onChange={onChange}
            />
            <label htmlFor="floatingInput">Email Address</label>
          </div>
          <button type="submit" className="add-btn">
            Continue
          </button>
        </form>
      </div>
    </Fragment>
  );
};

ResetPassword.propTypes = {
  setAlert: PropTypes.func.isrequired,resetPassword: PropTypes.func.isrequired,};

export default connect(null,{ resetPassword,setAlert })(ResetPassword);

响应 JS 操作

export const resetPassword = (formData) => async (dispatch) => {
  try {
    const res = await api.post("/users/reset-password/:token",formData);
    dispatch({
      type: RESET_PASSWORD_SUCCESS,payload: res.data,});
    dispatch(
      setAlert("Password changed successfully. Please login again.","success")
    );
  } catch (err) {
    const errors = err.response.data.errors;

    if (errors) {
      errors.forEach((error) => dispatch(setAlert(error.msg,"danger")));
    }

    dispatch({
      type: RESET_PASSWORD_FAIL,});
  }
};

App.js 路由

<Route exact path="/reset-password/:token" component={ResetPassword} />

const api = axios.create({
  baseURL: '/api',headers: {
    'Content-Type': 'application/json'
  }
});

我得到的错误是会话已过期,请重试 请告诉我我哪里出错了。 尝试了所有可能的方法,我知道 user.findOne 方法有问题,但它在邮递员中工作正常,所以我不知道问题出在哪里。 感谢您的时间

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)