Вход по паспорту с React Router работает только при втором щелчке? - PullRequest
Новая
       59

Вход по паспорту с React Router работает только при втором щелчке?

0 голосов
/ 19 июня 2020

Мы пытаемся интегрировать аутентификацию Passport с нашим приложением React, и мы используем React Router.

При первой отправке правильных учетных данных пользователя сервер получает сообщение, добавляет сеанс к нашему база данных и, кажется, отправляет ответ, но клиент не обновляется. Имя пользователя и пароль отображаются в URL-адресе в виде строки запроса. Затем, когда мы повторно отправляем учетные данные, не удаляя строку запроса из URL-адреса, клиент может получить ответ от сервера.

Другими словами, если мы не обновим sh перед повторной отправкой информации для входа, это сработает.

Это обработчик кликов, который использует наша форма: 

  const handleClick = () => {
    return axios.post('/login', { username, password })
      .then(({ data }) => {
        const { message } = data;
        if (message === 'success') {
          const { user } = data;
          setUserId(user.id);
          setUser(user);
        }
        setAuthStatus(message);
      })
      .catch(err => console.error(err));
  };

Это наш серверный маршрут, который попадает в каждый почтовый запрос: 

loginRouter.post('/', (req, res, next) => {
  console.log('stop');
  passport.authenticate('local', (err, user, info) => {
    const { invalidPassword } = info || false;
    if (err) {
      return next(err); // will generate a 500 error
    }
    if (!user) {
      return res.send({ message: 'invalidUser' });
    }

    if (invalidPassword) {
      return res.send({ message: 'invalidPassword' });
    }
    req.login(user, loginErr => {
      if (loginErr) {
        return next(loginErr);
      }
      return res.send({ user, message: 'success' });
    });
  })(req, res, next);
});

Это наша локальная стратегия Passport, которая использует Sequelize: 

passport.use(new LocalStrategy(
  (username, password, cb) => {
    User.findOne({ where: { username } })
      .then((user) => {
        if (!user) {
          return cb(null, false);
        }
        if (validPassword(password, user.hash, user.salt)) {
          return cb(null, user);
        }
        return cb(null, false, { invalidPassword: true });
      })
      .catch(err => {
        cb(err);
      });
  },
));

Проблемы с отладкой. .. Мы подозреваем, что ошибка на стороне клиента и может быть связана с React-Router. В этом проекте мы впервые используем React-Router и Passport.

Любая помощь приветствуется!

1 Ответ

0 голосов
/ 19 июня 2020

Welp ... Все, что нам не хватало, это событие как параметр в handleClick и event.preventDefault ().

...