Dashboard de Produtividade Pessoal T1E13: BugCT1-5 Erro 400 no login

INTRODUÇÃO

Post anterior: Dashboard de Produtividade Pessoal T1E12: BugCT1-4 Código pronto para login com Google Identity Services (GIS)

O objetivo deste post é apresentar um prompt para o Gemini 2.5 Pro (Prévia), no qual é feito um pedido de correção do "BugCT1-5 Erro 400 no login", que ocorreu durante o teste da correção do "ButCT1-4 Erro ao inicializar GAPI", no App Dashboard de Produtividade Pessoal (D2P).

Prompt 1 para o Gemini 2.5 Pro (Prévia)

1 Objetivo

Faça a correção do erro abaixo, que ocorreu no login realizado com GIS.

Erro 400: invalid_request

Detalhes da solicitação: origin=file:// flowName=GeneralOAuthFlow

2 Contexto

2.1 Identificação do Problema

BugCT1-5 Erro no login com GIS

2.2 Observação

Quando ocorreu o problema:

• Durante o desenvolvimento do App Dashboard de Produtividade Pessoal
• Durante a execução do Caso de Teste 1: Tarefa sem pausa
• Durante o teste da correção do problema identificado por BugCT1-4 Erro ao inicializar GAPI

Resposta 1 do Gemini 2.5 Pro (Prévia)

Erro de Login com GIS: Correção do "Erro 400: invalid_request" com "origin=file://"

Objetivo: Este documento detalha a causa e a solução para o "Erro 400: invalid_request" com detalhes de origin=file:// e flowName=GeneralOAuthFlow, ocorrido durante o login com Google Identity Services (GIS) no desenvolvimento do aplicativo Dashboard de Produtividade Pessoal.

---

1. Análise do Problema (BugCT1-5)

O erro 400: invalid_request sinaliza que a requisição enviada ao servidor de autenticação do Google é malformada ou viola as políticas de segurança da plataforma. O detalhe crucial neste caso é o parâmetro origin=file://.

Causa Raiz: O protocolo file:// indica que a página que está tentando iniciar o fluxo de login está sendo executada diretamente de um arquivo local no sistema de arquivos do computador (por exemplo, ao abrir um arquivo HTML diretamente no navegador). Por razões de segurança, o Google OAuth 2.0 e o Google Identity Services (GIS) não permitem requisições de autenticação originadas de file://.

Isso ocorre porque a origem file:// não é uma origem segura e única. Ela não representa um domínio web específico, o que impossibilita o Google de verificar a identidade e a legitimidade da aplicação que solicita o acesso aos dados do usuário. Permitir tais requisições abriria uma brecha de segurança significativa, conhecida como "ataque do impostor confuso" (confused deputy problem).

Em resumo, o Google exige que todas as aplicações que utilizam seu sistema de autenticação sejam executadas a partir de uma origem HTTP ou HTTPS autorizada e registrada no Google Cloud Console.

2. Contexto da Ocorrência

• Aplicação: App Dashboard de Produtividade Pessoal
• Caso de Teste: CT1 - Tarefa sem pausa
• Momento: Durante o teste da correção para o BugCT1-4 Erro ao inicializar GAPI. É provável que, ao corrigir a inicialização da GAPI, a chamada de login tenha sido executada com sucesso, mas de um ambiente de desenvolvimento inadequado.

3. Solução e Correção

Para corrigir o BugCT1-5, é necessário servir a aplicação a partir de um servidor web local durante o desenvolvimento. Isso fará com que a origem da requisição de login seja http://localhost:[porta], uma origem permitida para fins de desenvolvimento pelo Google.

Passos para a Correção:

1. Configurar um Servidor Web Local: Utilize um servidor de desenvolvimento para servir os arquivos da sua aplicação. Dependendo da tecnologia utilizada no seu projeto (Node.js, Python, etc.), as ferramentas podem variar. Abaixo estão alguns exemplos comuns:

   • Para projetos com Node.js: Se você utiliza Node.js, pode usar o pacote http-server.

     • Instale o http-server globalmente (se ainda não o tiver):
       Bash

       npm install -g http-server
       

     • Navegue até o diretório raiz do seu projeto (onde se encontra o seu index.html) e inicie o servidor:
       Bash

       http-server
       

     Isso iniciará um servidor, geralmente em http://localhost:8080.

   • Para projetos com Python: Python vem com um módulo de servidor HTTP integrado.

     • Navegue até o diretório raiz do seu projeto.
     • Para Python 3, execute:
       Bash

       python -m http.server
       

     • Para Python 2, execute:
       Bash

       python -m SimpleHTTPServer
       

     Isso iniciará um servidor, geralmente em http://localhost:8000.

   • Utilizando a Extensão Live Server do VS Code: Se você utiliza o Visual Studio Code, a extensão "Live Server" é uma excelente opção para criar um servidor de desenvolvimento com um clique.

2. Atualizar as Origens JavaScript Autorizadas no Google Cloud Console:

   • Acesse o Google Cloud Console.
   • Navegue até "APIs e Serviços" > "Credenciais".
   • Selecione o ID do Cliente OAuth 2.0 que você está utilizando para a sua aplicação web.
   • Na seção "Origens JavaScript autorizadas", adicione o endereço do seu servidor de desenvolvimento local. Por exemplo:
     • http://localhost:8080
     • http://localhost:8000
     • http://localhost (para cobrir diferentes portas)

   Importante: Não utilize file:// nesta seção.

3. Acessar a Aplicação pelo Servidor Local: Após iniciar o servidor local e configurar as origens no Google Cloud Console, acesse sua aplicação no navegador utilizando o endereço fornecido pelo servidor (ex: http://localhost:8080) em vez de abrir o arquivo HTML diretamente.

Ao seguir estes passos, a requisição de login com GIS terá como origem um endereço http://localhost, que é válido para o ambiente de desenvolvimento, e o erro 400: invalid_request será resolvido.

CONCLUSÃO

O bug identificado por "BugCT1-5 Erro 400 no login" foi resolvido.

Próximo post: