4

Quero abrir um servidor local para testar meu projeto em ReactJS, mas quero que eu possa tanto ver ele localmente na minha máquina quanto em outro computador.

Eu tenho que abrir alguma porta?

Edit: Os dois usando a mesma rede.

5
  • Este outro "Computador" está na mesma rede? Commented 15/05/2019 às 19:27
  • Os dois usando a mesma rede Commented 15/05/2019 às 22:06
  • Basta pegar o seu ip local (192.168...) e acessar pelo outro computador com a porta configurada no servidor principal. Lembre-se de abrir as portas no firewall dos computadores. (Caso use o windows, desative-o temporariamente, caso use linux, crie exceção no iptables) Commented 15/05/2019 às 23:54
  • Vou tentar, tem algum modo sem usar portas ? setar para não usar nenhuma ? Eu já usei o XAMP para alguns testes e transferir arquivos conectando direto no ip da maquina. Commented 16/05/2019 às 0:43
  • desligue o firewall a porta se abrirá Commented 6/05/2022 às 20:53

2 Respostas 2

3

Sempre que você carrega uma URL sem especificar o número da porta, o padrão do navegador é 80, porque 80 é o número da porta padrão para HTTP.

Portanto, se você carregar http://stackoverflow.com/questions, o navegador "converte" em http://stackoverflow.com:80/questions.

Se você não quiser que um número de porta seja especificado para acessar seu site, seu aplicativo deve estar escutando na porta 80, em vez de 3000.

// app.js

const http = require('http');

// Crie uma instância do servidor http para manipular solicitações HTTP
let app = http.createServer((req, res) => {
    res.writeHead(200, {'Content-Type': 'text/plain'});

    res.end('Hello World!\n');
});

// Inicie o servidor na porta 80
app.listen(80, '127.0.0.1');

No entanto, não é recomendado para aplicativos do Node escutar diretamente na porta 80 (embora eles possam muito bem).

Agora se quiser acessar o site através de um outro computador que está na mesma rede:

@Paulo Victor Basta pegar o seu ip local (192.168...) e acessar pelo outro computador com a porta configurada no servidor principal. Lembre-se de abrir as portas no firewall dos computadores. (Caso use o windows, desative-o temporariamente, caso use linux, crie exceção no iptables)

Em muitos casos quando tentar correr o Nodejs na porta 80 vai dar erro do tipo Error: listen EACCES 127.0.0.1:80.

Entretanto, para ultrapassar essa questão podes usar um proxy voltado para a frente, como nginx, que aceita conexões com a porta 80 do host e, em seguida, redireciona a solicitação para localhost: 3000, onde seu aplicativo está escutando.

1

Outra solução é usar o https://nextjs.org/ :)

Com alguns comandos você consegue servir o seu projeto React em um servidor estático local.

Ele também tem outras funcionalidades legais que você pode usar (Server-Side Rendering, Static Exporting, etc ...)

  1. Para começar:
npm install --save next react react-dom
  1. Adicionar ao package.json
{
  "scripts": {
    "dev": "next",
    "build": "next build",
    "start": "next start"
  }
}
  1. Criar um arquivo no diretório ./pages/index.js
function Home() {
  return <MeuComponenteReact></MeuComponenteReact>;
}

export default Home;
  1. E rodar o projeto:
npm run dev
  1. Depois basta acessar http://localhost:3000

Docs: https://nextjs.org/docs

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .