Como redirecionar o usuário para outra página após o login usando JavaScript Fetch API?

No código fornecido, o método JavaScript fetch() é usado para enviar uma solicitação POST para um endpoint de back-end com um token obtido do Google. Após a validação do token no backend, um RedirectResponse é retornado com um código de status 303. No entanto, o redirecionamento não ocorre no navegador.

Opção 1: Retornando RedirectResponse

A função fetch() segue respostas de redirecionamento por padrão. Portanto, você pode usar as propriedades Response.redirected e Response.url na resposta fetch() para redirecionar manualmente o usuário.

Exemplo de trabalho:

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
  }
})

Opção 2: retornando resposta JSON com URL de redirecionamento

Como alternativa, o back-end pode retornar uma resposta JSON contendo o URL de redirecionamento. No frontend, você pode verificar a chave "url" na resposta e redirecionar o usuário de acordo.

Exemplo de trabalho:

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
  }
})

Opção 3: usando HTML

Se o uso de fetch() não for necessário, você pode usar um formulário HTML tradicional com um botão de envio. Quando o formulário for enviado, o navegador tratará automaticamente o redirecionamento se um RedirectResponse for retornado do servidor.