0

Прем здравствуйте, впервые делаю авторизацию, использую нод, монгодб и экспресс, все подключила, токен записывается в кукис, и теперь надо сделать, чтобы после логина открывалась следующая страница, а у меня остается страница с формой. Я нашла как это выполнить если токен хранится в local storage, но не знаю, как подстроить это с кукис, и вообще не уверена, правильно ли я делаю или нет. Возможно вопрос глупый, но я только учусь. Буду рада любой информации, большое спасибо! Ссылка на гит: https://github.com/daryalewy/kickstarter-app

Auth.js

import useToken from "../Components/useToken";


export default function Auth() {
  const Body = styled.section`
    min-height: 550px;
    min-width: 319.98px;
    background: linear-gradient(
      0deg,
      rgba(213, 189, 238, 1) 0%,
      rgba(166, 124, 232, 1) 100%
    );
    padding-top: 40px;
    position: relative;
  `;

  const { token, setToken } = useToken();

  if (!token) {
    return (
      <>
        <Body>
          <Logo />
          <Login setToken={setToken} />
        </Body>
        <Socials />
      </>
    );
  }

  return (
    <>
      <BrowserRouter>
        <Switch>
          <Route path="/">
            <MainPage />
          </Route>
        </Switch>
      </BrowserRouter>
    </>
  );
}

useToken.js

import { useState } from 'react';

export default function useToken() {
  const getToken = () => {
    const tokenString = localStorage.getItem('token');
    const userToken = JSON.parse(tokenString);
    return userToken?.token
  };

  const [token, setToken] = useState(getToken());

  const saveToken = userToken => {
    localStorage.setItem('token', JSON.stringify(userToken));
    setToken(userToken.token);
  };

  return {
    setToken: saveToken,
    token
  }
}

Routes in backend

router.post('/register', async (req, res) => {
  try {
    const { email, password } = req.body;
    if (!isEmail(email)) {
      throw new Error('Email must be a valid email address.');
    }
    if (typeof password !== 'string') {
      throw new Error('Password must be a string.');
    }
    const user = new User({ email, password });
    const persistedUser = await user.save();
    const userId = persistedUser._id;

    const session = await initSession(userId);

    res
      .cookie('token', session.token, {
        httpOnly: true,
        sameSite: true,
        maxAge: 1209600000,
        secure: process.env.NODE_ENV === 'production',
      })
      .status(201)
      .json({
        title: 'User Registration Successful',
        detail: 'Successfully registered new user',
        csrfToken: session.csrfToken,
      });
  } catch (err) {
    res.status(400).json({
      errors: [
        {
          title: 'Registration Error',
          detail: 'Something went wrong during registration process.',
          errorMessage: err.message,
        },
      ],
    });
  }
});

router.post('/login', async (req, res) => {
  try {
    const { email, password } = req.body;
    if (!isEmail(email)) {
      return res.status(400).json({
        errors: [
          {
            title: 'Bad Request',
            detail: 'Email must be a valid email address',
          },
        ],
      });
    }
    if (typeof password !== 'string') {
      return res.status(400).json({
        errors: [
          {
            title: 'Bad Request',
            detail: 'Password must be a string',
          },
        ],
      });
    }
    const user = await User.findOne({ email });
    if (!user) {
      throw new Error();
    }
    const userId = user._id;

    const passwordValidated = await bcrypt.compare(password, user.password);
    if (!passwordValidated) {
      throw new Error();
    }

    const session = await initSession(userId);

    res
      .cookie('token', session.token, {
        httpOnly: true,
        sameSite: true,
        maxAge: 1209600000,
        secure: process.env.NODE_ENV === 'production',
      })
      .json({
        title: 'Login Successful',
        detail: 'Successfully validated user credentials',
        csrfToken: session.csrfToken,
      });
  } catch (err) {
    res.status(401).json({
      errors: [
        {
          title: 'Invalid Credentials',
          detail: 'Check email and password combination',
          errorMessage: err.message,
        },
      ],
    });
  }
});

1 ответ 1

0

Посмотрите в сторону https://developer.mozilla.org/ru/docs/Web/API/History_API

Редирект на главную осуществляется на фронте.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.