Executando verificação de segurança...
3
S0lturne
1 min de leitura ·

Preciso de um auxílio com um problema em um projeto Angular + Node.js hospedado no Vercel

Olá olá! 👋
Gostaria de fazer uma pergunta que creio ter a ver mais com hospedagem do que código.

Tenho um site desenvolvido com Angular e Node.js, ambos hospedados na Vercel. Meu frontend consome uma API Node.js que inclui um endpoint POST para enviar um e-mail.

  • Tudo funciona perfeitamente em localhost.
  • Após o deploy na Vercel, a requisição POST falha com "405 Method Not Allowed", mesmo que requisições GET funcionem normalmente.

O que já tentei até agora:

  • Verifiquei as configurações de CORS (parece estar tudo certo e talvez eu nem precise pois a API e frontend estão no mesmo domínio);
  • Pesquisei na documentação e fóruns da Vercel;
  • Consultei chatbots (tive algumas ideias, mas nada resolveu);
  • Criar e ajustar o arquivo vercel.json para incluir os Headers de requisição;

Eu estou considerando hospedar a API separadamente na Vercel, mas gostaria de saber se há uma solução melhor antes de seguir esse caminho.

Carregando publicação patrocinada...
2
dealmeida

o sr criou um vercel.json?
não uso mais a vercel, porém, talvez seja necessário configurar um desse para permitir o acesso a métodos serverless. senão, a vercel vai entender que a aplicação node é estática.
exemplo de vercel.json:

{
  "rewrites": [
    { "source": "/api/(.*)", "destination": "/api/index.js" }
  ]
}

acima, todo endpoint /api/... vai cair em um arquivo index.js localizado na pasta /api com origem à raiz.

{
  "version": 2,
  "builds": [
    {
      "src": "api/index.ts",
      "use": "@vercel/node"
    }
  ],
  "routes": [
    {
      "src": "/api/(.*)",
      "dest": "/api/index.ts"
    }
  ]
}

acima, para todo endpoint /api/..., toda requisição vai cair em cima da aplicação que roda no arquivo index.ts na pasta /api, desde a raiz do projeto. se não estiver numa pasta api, pode acusar que está em outro diretório, mesmo.
talvez seja interessante ler a documentação, pois eu criei esse vercel.json na mão e nem o testei.
eu sei que talvez seja necessário um vercel.json, pois já me ocorreu esse erro ao utilizar sveltekit. para o sveltekit, que é fullstack, só me necessitou escolher se usaria vercel.json ou um adapter nativo.

se a vercel estiver mesmo hospedando tua aplicação como arquivos estáticos, basta provar acessando algo como https://DOMINIO-VERCEL.vercel.app/api/index.ts ou algo do tipo, assim talvez consiga visualizar o arquivo estático.

1
eliaseas

Abre o inspetor de rede e vê exatamente qual requisição está falhando, se é a POST ou a OPTIONS que a precede.

Acredito que seu problema seja no seu backend que simplemente não tem uma rota definida para o POST

1
S0lturne
Autor
Autor

É o POST, o OPTIONS nem chega a ser chamado.

Quanto ao código eu estou definindo corretamente, acredito. Pois é o famoso caso de "na minha máquina roda", então algo eu fiz certo kkkkk

Aqui está a definição das routes no meu server.js:

const contatoRoutes = require('./controllers/contato.controller');
app.use('/api/contato', contatoRoutes);

E aqui o meu método POST dentro do meu contato.controller.js:

// #region POST
router.post('/send', validatePayload, async (req, res) => {
  const returnModel = req.returnModel;
  const contatoFormModel = req.body;
  
  // Validação de campos...
  
  try {
    // Lógica do envio de email...
    
    returnModel.error = false;
    returnModel.code = 200;
    
    return res.status(200).json(returnModel);
  }
  catch (err) {
    returnModel.error = true;
    returnModel.errorMessage = `Ocorreu um erro ao enviar o formulário: ${err}`;
    returnModel.code = 500;

    return res.status(500).json(returnModel);
  }
});
// #endregion POST
2
dealmeida

talvez seja necessário criar um vercel.json. já me ocorreu esse erro uma vez. talvez tua aplicação esteja sendo hospedada como arquivos estáticos em vez de uma aplicação serverless.

1
S0lturne
Autor
Autor

Acredito que era exatamente isso. O que eu precisei fazer foi reorganizar e publicar minha API em outro projeto no Vercel, dessa vez com as configs certas e funcionou!

Te agradeço pelas sugestões! Foi uma mão fazer funcionar kkkk