El servicio de Linux utiliza el panel Pagoda para crear un sitio web y publicar el acceso a la red pública

Prefacio

Como panel de gestión de operación y mantenimiento de servidores simple y fácil de usar, Pagoda Panel soporta sistemas Linux/Windows, podemos usarlo para configurar entornos LAMP/LNMP, sitios web, bases de datos, FTP, etc. con un solo clic, y administrar fácilmente servidores a través de la Web.

En el siguiente tutorial, demostraremos cómo utilizar Pagoda Panel para crear rápida y fácilmente un sitio web local y realizar penetración en la intranet para que los usuarios que no están en la misma LAN también puedan acceder al sitio web local sin la necesidad de un IP pública o configurar un enrutador.

1. Instalación ambiental

Para instalar el servidor Apache, hacemos clic en el sitio web en el panel de pagoda y luego se nos pedirá que instalemos el servidor Apache.

Elija instalación rápida

Luego espere a que se complete la instalación. Cuando se complete la instalación, aparecerá una lista de mensajes a la izquierda.

2. Instalar la penetración de intranet cpolar

https://www.cpolar.com/

• Abra la ventana de comando de Pagoda Terminal y use el script de instalación de cpolar:

curl -L https://www.cpolar.com/static/downloads/install-release-cpolar.sh | sudo bash

• autenticación de token

Inicie sesión en el sitio web oficial de cpolar, haga clic a la izquierda 验证para ver su token de autenticación y luego péguelo en la línea de comando.

cpolar authtoken xxxxxxx

• Agregar servicios al sistema

sudo systemctl enable cpolar

• Iniciar servicio cpolar

sudo systemctl start cpolar

• Puerto abierto 9200

Seleccione seguridad en el panel de Pagoda y luego abra el puerto 9200.

• Inicie sesión en la interfaz de administración de la interfaz de usuario web de cpolar

Luego acceda a la IP de LAN al puerto 9200 y aparecerá la interfaz de administración de cpolar, ingrese su cuenta de correo electrónico de cpolar para iniciar sesión.

3. Penetración de intranet

Después de iniciar sesión en la interfaz de administración de la interfaz de usuario web de cpolar, creamos un túnel http que apunta al puerto 80, porque el servicio Apache predeterminado es el puerto 80.

• Nombre del túnel: Personalizable, cuidado con no repetirlo
• Protocolo: http
• Dirección local: 80
• Tipo de puerto: nombre de dominio aleatorio
• Región: China vip

Hacer clic创建

Una vez que la creación sea exitosa, abrimos la lista de túneles en línea y copiamos la dirección de red pública creada.

Luego abrimos el panel de Pagoda, hacemos clic en el sitio web, seleccionamos Agregar sitio, pegamos la dirección de red pública copiada en el cuadro de parámetros del nombre de dominio y luego hacemos clic en Enviar.

En este momento podemos ver que el sitio fue creado exitosamente.

Luego usamos la dirección de red pública copiada, abrimos el navegador para acceder y aparece la página de bienvenida para indicar el éxito.

4. Dirección http fija

Dado que el túnel recién creado utiliza una dirección temporal aleatoria, la dirección cambiará dentro de las 24 horas. Para acceso remoto a largo plazo, a continuación configuramos esta dirección de red pública como fija.

Debe actualizar al paquete básico o superior para admitir la configuración de nombres de subdominio de segundo nivel.

Inicie sesión en el backend del sitio web oficial de cpolar, haga clic en el panel de la izquierda 预留, búsquelo 保留二级子域名y reserve un nombre de subdominio de segundo nivel para el túnel http.

• Región: seleccione la región del servidor
• Nombre: Complete el nombre del subdominio de segundo nivel que desea reservar (se puede personalizar)
• Descripción: Notas, que se pueden personalizar.

Este ejemplo reserva un mywebsitegamesubdominio de segundo nivel llamado . Una vez que el nombre del subdominio se reserva con éxito, copiamos el nombre del subdominio y luego lo configuramos en el túnel.

5. Configure el nombre del subdominio de segundo nivel.

Inicie sesión en la interfaz de administración de la interfaz de usuario web de cpolar. 隧道管理Haga clic en el panel izquierdo 隧道列表, busque el túnel que debe configurarse con un nombre de subdominio de segundo nivel (en este caso, el túnel del sitio web de Apache) y haga clic en el lado derecho.编辑

Modifique la información del túnel y configure el nombre del subdominio de segundo nivel en el túnel:

• Tipo de dominio: seleccione en su lugar二级子域名
• Subdominio: complete el nombre del subdominio de segundo nivel que acabamos de reservar (en este ejemplo mywebsitegame)

Una vez completada la modificación, haga clic en更新

状态Después de que el túnel se haya actualizado correctamente, haga clic en - en el panel izquierdo 在线隧道列表. Puede ver que la dirección de red pública del túnel se ha actualizado a un nombre de subdominio de segundo nivel. Copie la dirección de red pública.

Luego abrimos el panel de Pagoda, buscamos el sitio y hacemos clic en Configuración

Agregar un nombre de dominio de dirección pública fija

Luego elimine la dirección aleatoria creada antes

Luego abrimos el navegador y utilizamos la dirección de red pública fija para acceder, arriba hemos configurado el acceso remoto al sitio.

6. Crea una página de prueba

Haga clic en la ruta del directorio raíz del sitio y haga clic directamente

Crea una nueva página llamada juego.html

Luego haga doble clic en el archivo para editarlo, copie el siguiente código en él (minijuego Snake) y luego Ctrl+S para guardar.

<!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>

Luego, nuestro navegador usa la dirección de red pública y agrega este archivo html para acceder, y podemos ver el minijuego que implementamos.

Reimpreso del artículo de cpolar pole cloud: el servicio Linux utiliza el panel Pagoda para crear un sitio web y publicar el acceso a la red pública