Uma maneira rápida de construir um servidor HTTP Node.js simples e publicar acesso remoto à rede pública

Prefácio

Node.js é um ambiente de tempo de execução de plataforma cruzada de código aberto para executar JavaScript no lado do servidor. O Node.js pertence e é mantido pela OpenJS Foundation (anteriormente Node.js Foundation, que se fundiu com a JS Foundation) e também é um projeto da Linux Foundation. Node.js usa o código de execução V8 desenvolvido pelo Google e usa tecnologias como modelos de entrada e saída orientados a eventos, sem bloqueio e assíncronos para melhorar o desempenho e otimizar o volume de transmissão e a escala dos aplicativos. Essas técnicas são normalmente usadas em aplicativos em tempo real com uso intensivo de dados.

A maioria dos módulos básicos do Node.js são escritos em linguagem JavaScript. Antes do surgimento do Node.js, o JavaScript era geralmente usado como linguagem de programação do lado do cliente, e os programas escritos em JavaScript geralmente eram executados no navegador do usuário. O surgimento do Node.js permite que o JavaScript seja usado para programação no lado do servidor. Node.js contém uma série de módulos integrados que permitem que o programa seja separado do Apache HTTP Server ou IIS e executado como um servidor independente. A seguir será apresentado como acessar o servidor windwos node.js em uma rede pública remota em alguns passos simples.

1. Instale o ambiente Node.js.

Baixe node.js do site oficial, escolhemos a instalação com um clique de 64 bits

https://nodejs.org/zh-cn/download/

imagem-20230302141011787

Após a instalação, abrimos o cmd, digitamos o comando e o número da versão aparecerá normalmente, indicando que a instalação foi bem-sucedida. A versão de instalação com um clique configurará as variáveis ​​​​de ambiente por padrão.

node -v

imagem-20230302150424377

2. Crie o serviço node.js.

Aqui criamos um serviço nodejs simples localmente e criamos um jogo de página de cobra para demonstração.

Primeiro crie uma pasta localmente e crie 2 novos arquivos na pasta, um é jsum arquivo e o outro é um htmlarquivo.Eles precisam ser colocados no mesmo diretório e depois abertos com vscode.

  • game.html文件
  • nodetest.js文件

imagem-20230302155043387

Adicione game.htmlo seguinte htmlcódigo e salve-o. O código a seguir é um jogo de página HTML (Snake)

<!DOCTYPE html>
<html>
<head>
	<title>贪吃蛇</title>
	<meta charset="UTF-8">
	<meta name="keywords" content="贪吃蛇">
	<meta name="Description" content="这是一个初学者用来学习的小游戏">
	<style type="text/css">
	*{
      
      margin:0;}
	.map{
      
      margin:100px auto;
		height:600px;
		width:900px;
		background:#00D0FF;
		border:10px solid #AFAEB2;
		border-radius:8px;
	}
	</style>
</head>
 
<body>
<div class="map">
<canvas id="canvas" height="600" width="900">
	
</canvas>
</div>
 
<script type="text/javascript">
 //获取绘制工具
	/*
	var canvas = document.getElementById("canvas");
	var ctx = canvas.getContext("2d");//获取上下文
	ctx.moveTo(0,0);
	ctx.lineTo(450,450);*/
	var c=document.getElementById("canvas");
    var ctx=c.getContext("2d");
    /*ctx.beginPath();
    ctx.moveTo(0,0);
    ctx.lineTo(450,450);
    ctx.stroke();
    */
 
    var snake =[];//定义一条蛇,画蛇的身体
    var snakeCount = 6;//初始化蛇的长度
	var foodx =0;
	var foody =0;
    var togo =0;
    function drawtable()//画地图的函数
    {
      
      
 
 
    	for(var i=0;i<60;i++)//画竖线
    	{
      
      
    		ctx.strokeStyle="black";
    		ctx.beginPath();
    		ctx.moveTo(15*i,0);
    		ctx.lineTo(15*i,600);
    		ctx.closePath();
    		ctx.stroke();
    	}
        for(var j=0;j<40;j++)//画横线
    	{
      
      
    		ctx.strokeStyle="black";
    		ctx.beginPath();
    		ctx.moveTo(0,15*j);
    		ctx.lineTo(900,15*j);
    		ctx.closePath();
    		ctx.stroke();
    	}
    	
    	for(var k=0;k<snakeCount;k++)//画蛇的身体
			{
      
      
			ctx.fillStyle="#000";
			if (k==snakeCount-1)
			{
      
      
				ctx.fillStyle="red";//蛇头的颜色与身体区分开
			}
			ctx.fillRect(snake[k].x,snake[k].y,15,15);//前两个数是矩形的起始坐标,后两个数是矩形的长宽。
			
			}
			//绘制食物	
    		ctx.fillStyle ="black";
	     ctx.fillRect(foodx,foody,15,15);
	     ctx.fill();
    	
    }
 
    
    function start()//定义蛇的坐标
    {
      
      
    	//var snake =[];//定义一条蛇,画蛇的身体
        //var snakeCount = 6;//初始化蛇的长度
		
		for(var k=0;k<snakeCount;k++)
    		{
      
      
    			snake[k]={
      
      x:k*15,y:0};
    			
            }
			
		  drawtable();
          addfood();//在start中调用添加食物函数
 
    }
 
    function addfood()
	{
      
      
	foodx = Math.floor(Math.random()*60)*15; //随机产生一个0-1之间的数
	foody = Math.floor(Math.random()*40)*15;
		
		for (var k=0;k<snake;k++)
		{
      
      
			if (foodx==snake[k].x&&foody==sanke[k].y)//防止产生的随机食物落在蛇身上
			{
      
      	
			addfood();
			}
		}
	
	
	}	
    		
   function move()
   {
      
      
	switch (togo)
	{
      
      
	case 1: snake.push({
      
      x:snake[snakeCount-1].x-15,y:snake[snakeCount-1].y}); break;//向左走
	case 2: snake.push({
      
      x:snake[snakeCount-1].x,y:snake[snakeCount-1].y-15}); break;
	case 3: snake.push({
      
      x:snake[snakeCount-1].x+15,y:snake[snakeCount-1].y}); break;
	case 4: snake.push({
      
      x:snake[snakeCount-1].x,y:snake[snakeCount-1].y+15}); break;
	case 5: snake.push({
      
      x:snake[snakeCount-1].x-15,y:snake[snakeCount-1].y-15}); break;
	case 6: snake.push({
      
      x:snake[snakeCount-1].x+15,y:snake[snakeCount-1].y+15}); break;
	default: snake.push({
      
      x:snake[snakeCount-1].x+15,y:snake[snakeCount-1].y});
	}
    snake.shift();//删除数组第一个元素
   	ctx.clearRect(0,0,900,600);//清除画布重新绘制
   	isEat();
	isDead();
	drawtable();
   } 			
   
   function keydown(e)
   {
      
      
   switch(e.keyCode)
		{
      
      
         case 37: togo=1; break;
		 case 38: togo=2; break;
		 case 39: togo=3; break;
		 case 40: togo=4; break;
		 case 65: togo=5; break;
		 case 68: togo=6; break;
		}
   }
   
   function isEat()//吃到食物后长度加1
   {
      
      
    if(snake[snakeCount-1].x==foodx&&snake[snakeCount-1].y==foody)
   {
      
      
		addfood();
		snakeCount++;
		snake.unshift({
      
      x:-15,y:-15});
   }
   
   }
   //死亡函数
   function isDead()
   {
      
      
    if (snake[snakeCount-1].x>885||snake[snakeCount-1].y>585||snake[snakeCount-1].x<0||snake[snakeCount-1].y<0)
		{
      
      
        

		window.location.reload();
		}
   }
   
    document.onkeydown=function(e)
{
      
      
	keydown(e);
 
} 
window.onload = function()//调用函数
{
      
       
	start();
	setInterval(move,150);
	drawtable();
	
	
 
}
</script>
</body>
</html>

nodetest.jsAdicione o seguinte jscódigo ao arquivo: O código a seguir significa abrir um http服务e definir o 3000número da porta de escuta.

const http = require('http');

//加载文件模块
const fs = require("fs");


const hostname = '127.0.0.1';
//端口
const port = 3000;

const server = http.createServer((req, res) => {
    
    
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/html');
  
  fs.readFile('./game.html', (err, data) => {
    
    
    if (err) throw err;
    console.log(data.toString);
    res.end(data);
  });
  
  
 
});

server.listen(port, hostname, () => {
    
    
  console.log(`Server running at http://${
      
      hostname}:${
      
      port}/`);
});

3. Acesse o serviço node.js.

Depois de escrever o código relevante, iniciamos o serviço. Digite o comando no console vscode [observe que você precisa inserir o diretório de arquivo correspondente para executar o comando]

node .\nodetest.js

imagem-20230302170633966

Há um serviço normal de prompt de retorno na porta local 3000. Abrimos o navegador e visitamos http://127.0.0.1:3000/.A interface da cobra parece indicar sucesso [Controle do jogo: teclado para cima, para baixo, teclas esquerda e direita ]

imagem-20230302171105342

4. Penetração da intranet

Aqui usamos cpolar para penetração na intranet, que suporta protocolos http/https/tcp, não limita o tráfego, não requer IP público e não requer configuração de roteador. É simples de usar.

4.1 Instalar e configurar a penetração da intranet cpolar

Site oficial da cpolar: https://www.cpolar.com/

Visite o site oficial da cpolar, registre uma conta, baixe e instale o cliente. Para obter instruções específicas de instalação, consulte o tutorial de documentação do site oficial.

  • Sistema Windows: Após baixar o pacote de instalação do site oficial, clique duas vezes no pacote de instalação e instale-o por padrão.
  • Sistema Linux: suporta script de instalação automática com um clique. Para obter detalhes, consulte a documentação do site oficial - Guia de primeiros passos

20230130105715

4.2 Criar porta local de mapeamento de túnel

Após a instalação bem-sucedida do cpolar, acesse a porta 9200 local http://localhost:9200 no navegador e faça login usando a conta de e-mail cpolar.

20230130105810

Clique em Tunnel Management - Create Tunnel no painel esquerdo para criar um túnel http apontando para a porta local 3000.

  • Nome do túnel: você pode personalizar o nome. Tenha cuidado para não duplicar o nome do túnel existente.
  • Protocolo: selecione http
  • Endereço local: 3000
  • Tipo de nome de domínio: escolha um nome de domínio aleatório gratuitamente
  • Região: Selecione China vip

Clique创建

imagem-20230302171633772

Depois que o túnel for criado com sucesso, clique em Status à esquerda - Lista de túneis on-line, visualize o endereço de rede pública gerado e copie o endereço

imagem-20230302171740715

Abra o navegador e use o endereço público acima para acessar. Neste ponto, publicamos com sucesso o node.jsserviço local no endereço público.

imagem-20230302171817498

5. Endereço de rede pública fixo

Como o túnel criado usando cpolar acima usa um endereço de rede pública aleatório, ele mudará aleatoriamente em 24 horas, o que não favorece o acesso remoto de longo prazo. Portanto, podemos configurar um nome de subdomínio de segundo nível para ele. Este endereço é fixo e não mudará aleatoriamente.

  • Reserve um subdomínio de segundo nível

Faça login no site oficial da cpolar, clique em Reservar à esquerda, selecione reservar o nome do subdomínio de segundo nível, defina um nome de subdomínio de segundo nível, clique em Reservar e copie o nome do subdomínio de segundo nível reservado após a reserva ser bem-sucedida.

imagem-20230302172317079

Depois que a reserva for bem-sucedida, copie o endereço do nome do subdomínio de segundo nível reservado

imagem-20230302172454064

  • Configurar nomes de subdomínios de segundo nível

Visite http://127.0.0.1:9200/, faça login na interface de gerenciamento da interface web cpolar, clique em Tunnel Management - Tunnel List no painel esquerdo, encontre os 3.000 túneis que deseja configurar e clique em Edit à direita

imagem-20230302172856768

Modifique as informações do túnel e configure o nome do subdomínio de segundo nível reservado com êxito no túnel.

  • Tipo de nome de domínio: selecione um nome de subdomínio de segundo nível
  • Subdomínio: preencha o nome do subdomínio de segundo nível reservado com sucesso

Clique更新

imagem-20230302172806823

Após a conclusão da atualização, abra a lista de túneis on-line. Neste momento, você pode ver que o endereço da rede pública mudou e o nome do endereço também mudou para o nome do subdomínio reservado de segundo nível. Copie-o.

imagem-20230302172935943

Em seguida, use o endereço http fixo para abrir o acesso do navegador

imagem-20230302173012863
O acesso foi bem sucedido. Agora o endereço da rede pública está fixo e não mudará aleatoriamente. Penetrou com sucesso na intranet cpolar para obter acesso remoto aos serviços nodejs sem exigir um endereço IP público ou configurar um roteador.

Reimpresso do artigo cpolar pole cloud: Acesso remoto ao serviço Node.js na rede pública [penetração da intranet cpolar]

Acho que você gosta

Origin blog.csdn.net/m0_67768006/article/details/132547968
Recomendado
Clasificación