Как перенаправить пользователя на другую страницу после входа в систему с помощью JavaScript Fetch API?

В предоставленном коде используется метод JavaScript fetch() используется для отправки запроса POST на серверную конечную точку с токеном, полученным от Google. После проверки токена на серверной стороне возвращается RedirectResponse с кодом состояния 303. Однако перенаправление не происходит в браузере.

Вариант 1: возврат RedirectResponse

Функция fetch() по умолчанию следует за ответами на перенаправление. Таким образом, вы можете использовать свойства Response.redirected и Response.url в ответе fetch(), чтобы вручную перенаправить пользователя.

Рабочий пример:

fetch('http://localhost:8000/login', {
  method: 'POST',
  headers: { ... },
  body: { ... },
  redirect: 'follow'
})
.then(res => {
  if (res.redirected) {
    window.location.href = res.url;
  } else {
    // Handle non-redirect responses
  }
})

Вариант 2: возврат ответа JSON с URL-адресом перенаправления

В качестве альтернативы серверная часть может вернуть ответ JSON, содержащий URL-адрес перенаправления. Во внешнем интерфейсе вы можете проверить ключ «url» в ответе и соответствующим образом перенаправить пользователя.

Рабочий пример:

fetch('http://localhost:8000/login', {
  method: 'POST',
  headers: { ... },
  body: { ... },
})
.then(res => res.json())
.then(data => {
  if (data.url) {
    window.location.href = data.url;
  } else {
    // Handle non-redirect responses
  }
})

Вариант 3: использование HTML

Если использование fetch() не требуется, вы можете использовать традиционную HTML-форму с кнопкой отправки. При отправке формы браузер автоматически обрабатывает перенаправление, если с сервера возвращается RedirectResponse.