Перенаправление после входа в систему через POST с использованием Express и Javascript - PullRequest
3 голосов
/ 26 мая 2020

Я пытаюсь создать свое первое приложение Node.js. Прямо сейчас я работаю над сайтом входа, который должен перенаправлять пользователя на / backend после успешного входа в систему. Однако в консоли вроде все работает нормально, а браузер просто ничего не делает. Я нашел несколько похожих сообщений здесь, в stackoverflow, но большинство людей использовали AJAX, и я не мог найти ничего, что сработало бы для меня.

Вот мой метод POST. Сначала он аутентифицирует пользователя, и в случае успеха я хочу, чтобы меня перенаправили:

router.post('/login', (req, res) => {
    store
        .authenticate({
            username: req.body.username,
            password: req.body.password
        })
        .then(({ success }) => {
            if (success) {
                res.redirect('/backend')
            }
            else res.sendStatus(401)
        })
}); 

Вот мой GET-метод для внутреннего сайта:

router.get('/', function(req, res, next) {
  res.render('backend/backend');
}); 

Не уверен, нужно ли, но вот прослушиватель событий, который запускает метод POST:

const Login = document.querySelector('.Login')
Login.addEventListener('submit', (e) => {
  e.preventDefault()
  const username = Login.querySelector('.username').value
  const password = Login.querySelector('.password').value
  post('/login/login', { username, password })
    .then(({ status }) => {
      if (status === 200) alert('login success')
      else alert('login failed')
    })
})

Моя консоль показывает что-то вроде этого: Проверка подлинности имени пользователя POST / login / login 302 GET / backend 304

Однако мой браузер не 't show / backend, хотя GET-Method явно вызывается. Спасибо за помощь!

1 Ответ

3 голосов
/ 26 мая 2020

Я не знаю о функции post и ее параметрах, но если вы замените ее функцией fetch, тогда вы можете установить свойство redirect: 'follow' на перенаправление всякий раз, когда сервер сообщает ему сделать.

const Login = document.querySelector('.Login')
Login.addEventListener('submit', (e) => {
  e.preventDefault()
  const username = Login.querySelector('.username').value
  const password = Login.querySelector('.password').value
  fetch('/login/login', {
    method: 'POST',
    body: JSON.stringify({ username, password }),
    redirect: 'follow'
  }).then(({ status }) => {
    if (status !== 200) alert('login failed')
  })
})

В качестве альтернативы вы можете отправить URL-адрес, на который вы должны перенаправить с сервера, и вручную перенаправить на страницу с клиента.

// Instead of res.redirect(), use send to send the URL back to the client.
res.send('/backend');
const Login = document.querySelector('.Login')
Login.addEventListener('submit', (e) => {
  e.preventDefault()
  const username = Login.querySelector('.username').value
  const password = Login.querySelector('.password').value
  post('/login/login', { username, password })
    .then((response) => {
      if (response.status === 200) {
        alert('login success');
        return response.text();
      }
      else alert('login failed')
    })
    .then((url) => {
      location.replace(location.origin + url);
    });
})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...