11
respostas

Não consigo abrir o "localhost:3000"

Segui o roteiro de instalação da aula, mas ao final não consegui abir o site pelo endereço "localhost:3000" e nem do "localhost:3001".

Resposta da execução do npm start

PS D:\_Cursos\Alura.com.br\03 - Formação Angular\alurabank> npm start

> alurabank@1.0.0 start D:\_Cursos\Alura.com.br\03 - Formação Angular\alurabank
> concurrently "npm run watch" "npm run server"

[0] 
[0] > alurabank@1.0.0 watch D:\_Cursos\Alura.com.br\03 - Formação Angular\alurabank
[0] > tsc -w
[0]
[1] 
[1] > alurabank@1.0.0 server D:\_Cursos\Alura.com.br\03 - Formação Angular\alurabank
[1] > lite-server --baseDir=app
[1]
[1] Did not detect a `bs-config.json` or `bs-config.js` override file. Using lite-server defaults...
[1] ** browser-sync config **
[1] {
[1]   injectChanges: false,
[1]   files: [ './**/*.{html,htm,css,js}' ],
[1]   watchOptions: { ignored: 'node_modules' },
[1]   server: { baseDir: 'app', middleware: [ [Function], [Function] ] }
[1] }
[0] 3:00:29 - Compilation complete. Watching for file changes.
[0]
[0]
[1] [Browsersync] Access URLs:
[1]  --------------------------------------
[1]        Local: http://localhost:3000
[1]     External: http://192.168.1.125:3000
[1]  --------------------------------------
[1]           UI: http://localhost:3001
[1]  UI External: http://localhost:3001
[1]  --------------------------------------
[1] [Browsersync] Serving files from: app
[1] [Browsersync] Watching files...
[1] [Browsersync] Reloading Browsers... (buffered 7 events)

Quando eu gravo um arquivo TS o browser (Chrome) faz o reload, mas continua dando mensagem:

Não foi possível estabelecer uma conexão segura com este sitelocalhost enviou uma resposta inválida.
Tente executar o Diagnóstico de Rede do Windows.
ERR_SSL_PROTOCOL_ERROR

<Recarregar>

Estou usando Windows10 Pro x64 Português.

O módulo 1 foi realizado com sucesso total, sem nenhum problema, mas agora ocorreu este erro e não estou conseguindo resolver.

11 respostas

Fala ai Marcélio, tudo bem? Estranho, pela saída do console parece que deu certo e o servidor local está sendo executado e ouvindo a porta 3000.

Se você tentar acessar o navegador logo após rodar o comando sem alterar nenhuma arquivo funciona? Acho que o problema pode estar em relação ao segundo erro que ocorre após alterar algum arquivo.

Verifique a versão da lite-server instalado e veja se é equivalente a utilizada no curso, pode ser comportamento diferente entre versões diferentes.

Espero ter ajudado.

Olá Matheus,

Usei exatamente as versões indicadas durante o curso.

Não consigo que o "localhost:3000" abra o projeto e sempre recebo a mensagem de erro relatada.

Estou armazenando em um arquivo separado a lista de instalações que está sendo realizada durante o curso e pode ser visto abaixo:

npm install typescript@2.3.2 --save-dev
npm install @types/jquery@2.0.42 --save-dev
npm install @types/lodash --save-dev
npm install @types/underscore --save-dev

# Servidor Web - lite-server
npm install lite-server@2.3.0 --save-dev
npm install concurrently@3.4.0 --save-dev 

Não estou conseguindo acessar pelo lite-server, já refiz o ambiente, refazendo todo o processo de instalação, mas continua não funcionando.

Se abro o index.html diretamente pelo Browser, recebo as seguintes mensagens de erro:

Access to XMLHttpRequest at 'file:///D:/_Cursos/Alura.com.br/03-Forma%C3%A7%C3%A3o%20Angular/alurabank/app/js/app.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https. [index.html:1]

(SystemJS) XHR error loading file:///D:/_Cursos/Alura.com.br/03-Forma%C3%A7%C3%A3o%20Angular/alurabank/app/js/app.js
    Error: XHR error loading file:///D:/_Cursos/Alura.com.br/03-Forma%C3%A7%C3%A3o%20Angular/alurabank/app/js/app.js
    Error loading file:///D:/_Cursos/Alura.com.br/03-Forma%C3%A7%C3%A3o%20Angular/alurabank/app/js/app.js
(anonymous) @ index.html:44
Promise.catch (async)
(anonymous) @ index.html:44  [index.html:44]

GET file:///D:/_Cursos/Alura.com.br/03-Forma%C3%A7%C3%A3o%20Angular/alurabank/app/js/app.js net::ERR_FAILED  [system.src.js:1043]

Assim não estou conseguindo dar continuidade ao acompanhamento das atividades executadas durante o curso.

Se puderem me ajudar, seria muito bom.

Fala Marcelio, compartilha o projeto completo comigo, assim eu consigo simular o problema por aqui e analisá-lo com mais calma.

Pode compartilhar através do Github ou Google Drive (zipado).

Fico no aguardo.

Caro Matheus,

Eu fiz o zip do diretório alurabank e disponibilizei no meu Google Drive: Link https://drive.google.com/file/d/1ATLcdZ8TS2JyhsrbLUuABXXV_HBlbqb2/view?usp=sharing

Espero que você possa me ajudar a encontrar o problema.

Caro Matheus, estou usando uma licença do Tribunal Superior Eleitoral para efetuar os treinamentos e com este problema não estou conseguindo dar continuidade e acompanhamento das orientações do curso.

Minha licença é até o dia 08/08 ou 09/09, e agora, estes dias que estou tentando resolver o problema vão ficar perdidos?

Teria como a Alura estender alguns dias para que eu possa dar continuidade ao processo de estudos que estava programado.

Além destes cursos TypeScript há outros e como não consegui uma continuidade e aproveitamento adequados, fica comprometida minha meta de estudos.

Até já partir para tentar usar uma Máquina Virtual Linux para tentar resolver o problema, mas ainda está em faze de configuração do ambiente para que eu possa executar os recursos e exemplos passados no curso.

Como estou online, e realizando o curso de casa, fiz a postagem logo após sua resposata, mas, compreendo, até agora ainda não houve uma resposta efetiva sobre o problema apresentado.

Lembro que também fiz um outro procedimento para tentar sanar o problema encontrado, mas não resolveu o problema de não conseguir acessar o AluraBank (projeto do curso) pelo lite-server. Este procedimento foi remover o diretório node_modules do projeto e efetuar o processo inteiro de instalação dos recursos que foram indicados ao longo do Curso 1 e do Curso 2 de TypeScript, até onde eu estou.

Abaixo está a lista dos comandos executados, no terminal dentro do diretório onde o AluraBank foi criado, e que está com o projeto exemplo do curso:

Comandos do Curso 1 de TypeScript:

npm install typescript@2.3.2 --save-dev
npm install @types/jquery@2.0.42 --save-dev
npm install @types/lodash --save-dev
npm install @types/underscore --save-dev

Comandos do Curso 2 de TypeScript:

npm install lite-server@2.3.0 --save-dev
npm install concurrently@3.4.0 --save-dev 

Mas após refazer todo o processo de instalação, conforme indicado nos cursos, o problema ainda continua. Não consigo acesso ao endereço localhost:3000 e nem no localhost:3001, recebo sempre o erro já repassado em mensagem anterior, não conseguindo ver localmente o que foi incluído no projeto e também realizar experimentos em relação aos conhecimentos adquiridos durante as explicações.

Não foi possível estabelecer uma conexão segura com este sitelocalhost enviou uma resposta inválida.
Tente executar o Diagnóstico de Rede do Windows.
ERR_SSL_PROTOCOL_ERROR

<Recarregar>

Caro Matheus,

Consegui acessar os serviços utilizando o FireFox, mas conforme o Flávio comenta no curso em outro browser é apresentado vários Warnings e Mensagens no console do browser.

Não consegui entender o porquê do Chrome não acessar o serviço com o "localhost:3000", mas após conseguir o acesso pelo FireFox, tentei usar o endereço local para acessar o serviço e assim estou acessando o projeto (127.0.0.1:3000).

De qualquer forma obrigado pela atenção e se souber o que pode ser no Chrome que não está reconhecendo o "localhost", favor me enviar uma mensagem para que possa entender o que ocorreu.

Acesso pelo FireFox foi "localhost:3000" e pelo Chrome foi "127.0.0.1:3000".

O problema é que a atualização do BrowserSinc atualiza o Chrome com o endereço "localhost:3000", mas ai eu atualizo a guia com o endereço ip.

Realizando os testes com o acesso pelo IP não consigo que o código funcione.

  1. Não consegui receber o alert('oi') do código da aula 4 - Api Externa.
  2. Os demais conteúdos também não estão sendo visualizados no meu Chrome.

Como estou usando uma máquina do meu trabalho, em casa, ela está no domínio do TSE e por isto tem algumas configurações que notei que podem estar causando este problema. Notei que no hosts a linha que contém o endereço 127.0.0.1 localhost está comentada, mas por motivos de segurança da instalação se eu alterar este parâmetro acabo não conseguindo usar adequadamente o Windows.

O engraçado é que eu fiz os cursos de Elasticsearch e MongoDB e não tive estes problemas, inclusive usando o acesso com os endereços com localhost.

Se eu encontrar mais alguma outra informação, continuo incluindo aqui as informações para ver se conseguimos resolver o problema que estou tendo.

Fala ai Marcélio, vamos lá:

Teria como a Alura estender alguns dias para que eu possa dar continuidade ao processo de estudos que estava programado.

Preciso verificar isso com o pessoal, vou passar a mensagem para eles e alguém deve entrar em contato contigo ou eu respondo por aqui.

Sobre não conseguir acessar o localhost acredito e parece ser um problema específico da sua máquina, não sei como estão as configurações e restrições dela.

Eu testei seu projeto por aqui e funcionou certinho, não tive nenhum problema com o mesmo (seja para acessar ou utilizar).

Você tem algum computador ou notebook pessoal que poderia estar testando o projeto?

Espero ter ajudado.

Caro Matheus,

Pelas pesquisas que fiz, encontrei um artigo que fala que o Google Chrome não consegue reconhecer o localhost com endereço local e procura na Internet.

Isto ocorre quando você usa alguns programas de comunicação, como: Skype, Teams, Google Meeting, Zoom, Cisco Webex, TeamViewer ou outros que possibilitam o compartilhamento do status de determinados serviços na rede local para um listening local que provê acesso ao serviço internet (é como se fosse um servidor interno para determinados serviços).

Aqui, pelo trabalho tenho usado a maioria destas ferramentas e com isto, quando estão ativas não consigo que o Google Chrome acesse o serviço de suporte às aulas, para ver o resultado dos exercícios (quando tento acessar o endereço localhost:porta).

Engraçado que este mesmo comportamento não ocorre com os demais Browsers (IE, Edge, FireFox e outros), mas nestes outros browsers sempre há algum comportamento meio estranho ou fora do esperado.

Caso este problema venha ocorrer novamente com outro aluno, seira bom vocês compartilharem minha experiência, que deve ajudar.

De qualquer forma, obrigado pela atenção.

Fala Marcélio, muito bom a sua pesquisa.

Acho que o problema possa não ser o Google Chrome, isso porque funciona normalmente com localhost, eu sempre usei.

Para entender exatamente o que pode estar ocorrendo eu precisaria estar na sua máquina local.

Talvez o seu computador esteja apontando o localhost para outro IP que não seja sua máquina local ou o serviço não subiu corretamente local e na porta informada para ele.

Muito estranho esse problema.

Espero ter ajudado.

Matheus o arquivo hosts está corretamente configurado e o problema só ocorre no Google Chrome quando estou com as ferramentas de comunicação e trabalho remoto ativas.

No local hosts o endereço está 127.0.0.1 localhost.

Já fiz várias verificações e no meu Firewall não há restrições quanto ao uso deste endereço e nem algum bloqueio aos recursos instalados para execução dos cursos.

O estranho é que mesmo com as ferramentas em execução, o Google Chrome não acessando o localhost:4200 ou localhost:3000 ou outro, no IE, Edge e FireFox eu consigo acessar pelo endereço usando localhost:porta. Para acessar com o Google Chrome tenho que colocar o endereço 127.0.0.1:porta, mas este curso que estou fazendo de Angular e o de WebPack, como há consumo de serviço em outro server local e porta diferente, eu teria que alterar em toda a aplicação trocando o loalhost por 127.0.0.1, para então conseguir acessar sem que tivesse que parar minhas aplicações, mas este é um trabalho que eu não acho producente.

Mas de qualquer forma a informação que encontrei num grupo de suporte do Google Chrome, foi útil e reveladora. Pena que demorei a achar, mas resolvi compartilhar com vocês para o caso de algum outro aluno de vocês passarem por este problema.

Fala ai Marcélio, acabei dando uma pesquisada mais à fundo sobre o problema por aqui também.

Parece ser problema de cache, tente fazer o seguinte:

  1. Abra a ferramente de desenvolvedor do Google Chrome (F12)
  2. Navegue até a aba Network (Rede)
  3. Marque o Disable Cache (Desabilitar Cache).

Se essa solução não der certo, tente essa outra:

  1. Abre o Chrome digite na URL: chrome://net-internals/#hsts.
  2. Vá até a parte do Delete domain (Deletar dominio)
  3. No campo dominio, digite localhost e deleta.

Por fim uma mais completa, limpe todo o histório de navegação do Google Chrome.

  1. Vá em Configurações (Settings)
  2. Privacidade e Segurança (Privacy e Security)
  3. Limpar histórico de navegação (Clear browsing data).
  4. Marque todas as opções e mande limpar.

Caso nenhuma dessas faça o Chrome voltar a funcionar a gente vai se falando e procurando outras soluções.

Espero ter ajudado.