기사 디렉토리
머리말
Node.js는 서버 측에서 JavaScript를 실행하기 위한 오픈 소스 크로스 플랫폼 런타임 환경입니다. Node.js는 OpenJS Foundation(이전의 Node.js Foundation, JS Foundation과 합병됨)이 소유하고 관리하며 Linux Foundation의 프로젝트이기도 합니다. Node.js는 Google에서 개발한 V8 실행 코드를 사용하고 이벤트 기반, 비차단 및 비동기식 입력 및 출력 모델과 같은 기술을 사용하여 성능을 향상시키고 전송량과 애플리케이션 규모를 최적화합니다. 이러한 기술은 일반적으로 데이터 집약적인 실시간 애플리케이션에 사용됩니다.
Node.js의 기본 모듈은 대부분 JavaScript 언어로 작성되었습니다. Node.js가 등장하기 전에는 JavaScript가 클라이언트측 프로그래밍 언어로 주로 사용되었으며, JavaScript로 작성된 프로그램이 사용자의 브라우저에서 실행되는 경우가 많았습니다. Node.js의 출현으로 JavaScript를 서버 측 프로그래밍에 사용할 수 있게 되었습니다. Node.js에는 프로그램이 Apache HTTP Server 또는 IIS에서 분리되어 독립적인 서버로 실행될 수 있도록 하는 일련의 내장 모듈이 포함되어 있습니다. 다음은 원격 공용 네트워크에서 windwos node.js 서버에 액세스하는 방법을 소개합니다. 몇 가지 간단한 단계만 거치면 됩니다.
1. Node.js 환경 설치
공식 웹사이트에서 node.js를 다운로드하고 64비트 원클릭 설치를 선택합니다.
설치 후 cmd를 열고 명령을 입력하면 버전 번호가 정상적으로 나타나 설치가 성공했음을 나타내며 원 클릭 설치 버전은 기본적으로 환경 변수를 구성합니다.
node -v
2. node.js 서비스 생성
여기서는 간단한 nodejs 서비스를 로컬로 만들고 데모용 스네이크 페이지 게임을 만듭니다.
먼저 로컬에 폴더를 만들고 폴더에 2개의 새 파일을 만듭니다(하나는 js파일이고 다른 하나는 파일) html. 파일을 동일한 디렉터리에 배치한 다음 vscode로 열어야 합니다.
game.html文件nodetest.js文件
game.html다음 코드를 추가 html하고 저장합니다. 다음 코드는 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.jsjs파일에 다음 코드를 추가합니다 . 다음 코드는 하나를 열고 http服务리스닝 3000포트 번호를 설정한다는 의미입니다.
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. node.js 서비스에 접속
해당 코드를 작성한 후 서비스를 시작합니다.vscode 콘솔에 명령을 입력합니다.[명령을 실행하려면 해당 파일 디렉터리를 입력해야 합니다.]
node .\nodetest.js
로컬 포트 3000 아래에 일반적인 반환 프롬프트 서비스가 있습니다. 브라우저를 열고 http://127.0.0.1:3000/을 방문합니다. 스네이크 인터페이스가 성공을 나타내는 것으로 나타납니다. [게임 제어: 키보드 위, 아래, 왼쪽 및 오른쪽 키 ]
4.인트라넷 침투
여기서는 http/https/tcp 프로토콜을 지원하고 트래픽을 제한하지 않으며 공용 IP가 필요하지 않으며 라우터 설정이 필요하지 않은 인트라넷 침투를 위해 cpole을 사용합니다. 사용이 간단합니다.
4.1 cpole 인트라넷 침투 설치 및 구성
c폴라 공식 홈페이지: https://www.cpole.com/
cpole 공식 홈페이지를 방문하여 계정을 등록한 후 클라이언트를 다운로드하여 설치하세요.구체적인 설치 지침은 공식 홈페이지 설명서 튜토리얼을 참조하세요.
- Windows 시스템: 공식 웹사이트에서 설치 패키지를 다운로드한 후, 설치 패키지를 두 번 클릭하여 기본적으로 설치합니다.
- Linux 시스템: 원클릭 자동 설치 스크립트 지원 자세한 내용은 공식 웹사이트 설명서 - 시작 가이드를 참조하세요.
4.2 터널 매핑 로컬 포트 생성
cpole이 성공적으로 설치되면 브라우저에서 로컬 9200 포트 http://localhost:9200에 액세스하고 cpole 이메일 계정을 사용하여 로그인합니다.
왼쪽 대시보드에서 터널 관리 - 터널 생성을 클릭하여 로컬 포트 3000을 가리키는 http 터널을 생성합니다.
- 터널 이름: 이름을 사용자 정의할 수 있으며, 기존 터널 이름과 중복되지 않도록 주의하세요.
- 프로토콜: http를 선택하세요.
- 현지 주소: 3000
- 도메인 이름 유형: 무료로 임의의 도메인 이름을 선택하세요.
- 지역: 중국 VIP 선택
딸깍 하는 소리创建
터널이 성공적으로 생성된 후 왼쪽의 상태 - 온라인 터널 목록을 클릭하여 생성된 공용 네트워크 주소를 확인한 후 주소를 복사하세요.
브라우저를 열고 위의 공개 주소를 사용하여 접속하면, 현재 node.js공개 주소에 로컬 서비스가 성공적으로 게시되었습니다.
5. 고정된 공용 네트워크 주소
위의 cpole을 사용하여 생성된 터널은 임의의 공용 네트워크 주소를 사용하므로 24시간 이내에 무작위로 변경되므로 장기적인 원격 액세스에 도움이 되지 않습니다. 따라서 이에 대한 두 번째 수준 하위 도메인 이름을 구성할 수 있습니다. 이 주소는 고정된 주소이므로 무작위로 변경되지 않습니다.
- 두 번째 수준 하위 도메인 예약
cpole 공식 웹사이트에 로그인 후 왼쪽의 예약을 클릭하고 2차 하위 도메인 이름 예약을 선택하고 2차 하위 도메인 이름을 설정한 후 예약을 클릭하고 예약 성공 후 예약된 2차 하위 도메인 이름을 복사합니다.
예약 성공 후 예약된 2차 하위 도메인 이름 주소를 복사하세요.
- 두 번째 수준 하위 도메인 이름 구성
http://127.0.0.1:9200/을 방문하여 cpole 웹 UI 관리 인터페이스에 로그인한 후 왼쪽 대시보드에서 Tunnel Management - Tunnel List를 클릭하고 구성하려는 3000개의 터널을 찾은 후 오른쪽에서 Edit를 클릭합니다.
터널 정보를 수정하고 성공적으로 예약된 두 번째 수준 하위 도메인 이름을 터널에 구성합니다.
- 도메인 이름 유형: 두 번째 수준의 하위 도메인 이름을 선택합니다.
- 하위 도메인: 성공적으로 예약된 2차 하위 도메인 이름을 입력하세요.
딸깍 하는 소리更新
업데이트가 완료된 후 온라인 터널 목록을 열면, 이때 공용 네트워크 주소가 변경된 것을 확인할 수 있으며, 주소 이름도 예약된 2차 하위 도메인 이름으로 변경된 것을 복사합니다.
그런 다음 고정된 http 주소를 사용하여 브라우저 액세스를 엽니다.
접속에 성공했습니다. 이제 공용 네트워크 주소가 고정되어 임의로 변경되지 않습니다. 공용 IP 주소나 라우터 설정 없이 nodejs 서비스에 대한 원격 액세스를 달성하기 위해 cpole 인트라넷에 성공적으로 침투했습니다.
c폴라 극 클라우드 기사에서 재인쇄됨: 공용 네트워크에서 Node.js 서비스에 대한 원격 액세스 [cpole 인트라넷 침투]