Passei um dia tentando descobrir o que havia de errado com o retorno ilegível no navegador vindo do meu servidor de API em Flask. Curiosamente, tenho outros endpoints que funcionam perfeitamente, mas não essa nova rota que acabei de adicionar. Aqui está o que aprendi para corrigir o problema.
Descobrindo qual é a causa
Aprendi que há três motivos principais que causam isso.
- Content-Type - o charset não está definido como UTF-8, ou nem sequer está sendo percebido como JSON
- Content-Encoding - a compressão automática padrão do navegador para JSON entra em conflito com o método de codificação da API.
Duas formas de verificar
cURL
Abra o seu Terminal e use o cURL
curl -v "https://yourdomain.com/endpoint?"Se o JSON for exibido corretamente, significa que muito provavelmente é o navegador causando o problema.
Se estiver exibindo algo ilegível, certifique-se de que o charset está definido como UTF-8 no app Flask. Porque isso significa que o problema não está na transmissão, mas sim que algo não estava sendo tratado corretamente dentro do Flask, e pode ser um problema de tipo de objeto/codificação.
Ferramenta de desenvolvedor no navegador
- Vá até a aba Network e recarregue a página do seu endpoint
- Verifique se o Content-Type é ‘application/json; charset=UTF-8’
Soluções
Content-Type
Se estiver faltando application/json ou charset=UTF-8, adicione o seguinte response.header ao seu app de API em Flask para o seu endpoint:
response.headers['Content-Type'] = 'application/json; charset=UTF-8'Agora, reinicie o app e tente novamente para ver se funciona. Se não funcionar, prossiga para o próximo passo.
Content-Encoding
Agora, você já confirmou que o Content-Type não é o problema, pois ele aparece corretamente como application/json; charset=UTF-8. Vamos continuar com a segunda causa - erro de codificação.
Por padrão, quando uma API em Flask envia uma resposta ao navegador, ela comprime o conteúdo automaticamente. E então, o navegador tenta decodificá-lo. No entanto, por algum motivo, ele não consegue decodificá-lo corretamente.
O exemplo perfeito seria o cURL -v recebendo a resposta correta, mas no navegador ela aparece ilegível. (Este é o meu caso.) O cURL, por padrão, não recebe uma resposta comprimida/codificada, e é por isso que funciona no cURL mas não no navegador.
Para corrigir isso, você precisará adicionar o seguinte na resposta do seu app de API em Flask:
response.headers['Content-Encoding'] = 'identity'Isso desativará a compressão por padrão, para que o seu navegador receba o mesmo que o cURL recebe.
Isso deve resolver.
Boa sorte.