Não sei o que aconteceu. Até ontem tudo estava funcionando, até o fim da aula anterior. Hoje liguei o computador e inicializei tudo (incluindo o npm start na pasta do servidor):
D:\Documentos\Profissionais\Cursos\alura-typer\servidor>npm start
AluraTyper@1.0.0 start D:\Documentos\Profissionais\Cursos\alura-typer\servidor node server
consign v0.1.2 Initialized in app
- .\api\frases.js
- .\api\placar.js
- .\routes\frases.js
- .\routes\placar.js Banco data.db pronto para uso Servidor iniciado
Mas quando faço requisição nos botões da página para carregar uma página aleatória ou selecionar uma página pelo id recebo os respectivos erros na console:
Access to XMLHttpRequest at 'http://localhost:3000/frases' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Se chamo a URL pelo browser (http://localhost:3000/frases) a página coma as frases carrega normalmente.
Código das requisições:
$('#botao-frase').click(fraseAleatoria); $('#botao-frase-id').click(buscaFrase);
function fraseAleatoria () { $('#spinner').toggle(); $.get('http://localhost:3000/frases', trocaFraseAleatoria) .fail (erroServidor) .always (paraSpinner); };
function trocaFraseAleatoria (frasesRetornadas) { var frase = $('.frase'); var numeroAleatorio = Math.floor (Math.random() * frasesRetornadas.length); frase.text(frasesRetornadas[numeroAleatorio].texto); atualizaTempoInicial (frasesRetornadas[numeroAleatorio].tempo); atualizaTamanhoFrase(); }
function buscaFrase () { var fraseId = $('#frase-id').val(); var idEscolhido = { id: fraseId }; $('#spinner').toggle(); $.get('http://localhost:3000/frases', idEscolhido, trocaFrase) .fail (erroServidor) .always (paraSpinner); }
function trocaFrase (fraseSelecionada) { var frase = $('.frase'); frase.text(fraseSelecionada.texto); atualizaTempoInicial (fraseSelecionada.tempo); atualizaTamanhoFrase(); }
function erroServidor() { $('#erro').toggle(); setTimeout (function() { $('#erro').toggle(); },3000); }
function paraSpinner () { $('#spinner').toggle(); }
