12일차 연결 (net 및 socket.io)

1. Node.js Net 모듈(터미널 상호 작용)

Node.jsNet 모듈은 서버/클라이언트를 만드는 방법을 포함하는 기본 네트워크 통신용 가젯을 제공합니다. 다음과 같은 방법으로 이 모듈을 도입할 수 있습니다.

    var net = require("net")

인스턴스 생성 서버.js 파일, 코드는 다음과 같습니다.

var net = require('net');
var server = net.createServer(function(connection) { 
   console.log('client connected');
   connection.on('end', function() {
      console.log('       ');
   });
   connection.write('Hello World!\r
');
   connection.pipe(connection);
});
server.listen(8080, function() { 
  console.log('server is listening');
});

위의 서버 코드를 실행합니다.

$ node server.js
server is listening   #          8080

새 창을 열고client를 만듭니다.js 파일, 코드는 다음과 같습니다.

var net = require('net');
var client = net.connect({port: 8080}, function() {
   console.log('      ！');  
});
client.on('data', function(data) {
   console.log(data.toString());
   client.end();
});
client.on('end', function() { 
   console.log('         ');
});

다음 클라이언트의 코드를 실행합니다.

      ！
Hello World!

2. WebSocket

웹의 실시간 Push에 대해 말하자면 웹소켓이라고 할 수 밖에 없다.WebSocket이 등장하기 전에 많은 사이트에서 실시간 전송 기술을 실현하기 위해 일반적으로 사용하는 방안은 폴링(Polling)과Comet 기술이다. Comet은 두 가지 실현 방식으로 세분화할 수 있다. 하나는 긴 폴링 메커니즘이고 하나는 흐름 기술이라고 한다. 이 두 가지 방식은 사실상 폴링 기술의 개선이다. 이런 방안들은 뚜렷한 단점을 가져와 브라우저가 서버에 HTTP Request를 보내야 한다.서버 대역폭과 자원을 대량으로 소모하다.이런 상황에 직면하여 HTML5는 웹소켓 프로토콜을 정의하여 서버 자원과 대역폭을 더욱 절약하고 진정한 의미의 실시간 전송을 실현할 수 있다.
웹소켓 프로토콜은 본질적으로 TCP 기반의 프로토콜로 통신 프로토콜과 프로그래밍 API로 구성되어 있으며 웹소켓은 브라우저와 서버 간에 양방향 연결을 구축하여 이벤트 기반의 방식으로 브라우저에게 실시간 통신 능력을 부여할 수 있다.양방향 통신인 이상 서버 측과 클라이언트가 HTTP와 같은 요청과 응답을 동시에 보내고 응답할 수 있다는 뜻이다.

socket.io 모듈로 WebSocket(웹 실시간 상호작용)

Socket.IO는 Node를 통해 시작되는 WebSocket 라이브러리입니다.js는 웹소켓 서버를 실현하고 클라이언트 JS 라이브러리도 제공한다.Socket.IO는 모든 플랫폼, 브라우저 또는 모바일 장치에서 작동할 수 있는 이벤트 기반의 실시간 양방향 통신을 지원합니다.
Socket.IO는 4가지 프로토콜을 지원한다. 웹소켓, htmlfile, xhr-polling, jsonp-polling은 자동으로 브라우저에 따라 적합한 통신 방식을 선택하여 개발자가 플랫폼의 호환성이 아니라 기능의 실현에 초점을 맞출 수 있도록 한다. 동시에Socket.IO는 안정성과 성능이 우수합니다.
WebSocket 서버 구축

먼저 작업 목록에 들어가서 패키지라고 새로 만듭니다.json의 파일, 내용은 다음과 같다.

{
  "name": "realtime-server",
  "version": "0.0.1",
  "description": "my first realtime server",
  "dependencies": {}
}

다음에 npm 명령을 사용하여express와 socket을 설치합니다.io

npm install --save express
npm install --save socket.io

다음에 서버 코드를 작성할 수 있습니다. 새 파일: index.js

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

app.get('/', function(req, res){
    res.send('Welcome Realtime Server');
});

//    
var onlineUsers = {};
//      
var onlineCount = 0;

io.on('connection', function(socket){
    console.log('a user connected');
    
    //       
    socket.on('login', function(obj){
        ...
        
        //            
        io.emit('login', {onlineUsers:onlineUsers, onlineCount:onlineCount, user:obj});
        console.log(obj.username+'      ');
    });
    
    //      
    socket.on('disconnect', function(){
        //              
        if(onlineUsers.hasOwnProperty(socket.name)) {
            ...
            
            //            
            io.emit('logout', {onlineUsers:onlineUsers, onlineCount:onlineCount, user:obj});
            console.log(obj.username+'      ');
        }
    });
    
    //          
    socket.on('message', function(obj){
        //             
        io.emit('message', obj);
        console.log(obj.username+' ：'+obj.content);
    });
  
});

http.listen(3000, function(){
    console.log('listening on *:3000');
});

명령줄에서 node index를 실행합니다.js, 만약 모든 것이 순조롭다면, 당신은 되돌아온listening on *: 3000이라는 글자를 보게 될 것입니다. 이것은 서비스가 이미 성공적으로 구축되었다는 것을 의미합니다.브라우저가 열립니다.http://localhost:3000정상적인 환영 페이지를 볼 수 있을 거예요.

클라이언트, html 코드 만들기 socket.io.js 파일은 클라이언트 연결 서버의 js 코드 부분 코드를 다음과 같이 작성합니다:

//  websocket     
this.socket = io.connect('ws://172.16.0.254:3000');

//           
this.socket.emit('login', {userid:this.userid, username:this.username});

//       
this.socket.on('login', function(o){
    console.log(o);
    //  
    ...
});

//      
this.socket.on('logout', function(o){
    console.log(o);
    //  
    ...
});

//      
this.socket.on('message', function(obj){
    console.log(obj);
    //    
    ...
});

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

다양한 언어의 JSON

JSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

12일차 연결 (net 및 socket.io)

1. Node.js Net 모듈(터미널 상호 작용)

2. WebSocket

socket.io 모듈로 WebSocket(웹 실시간 상호작용)

Welcome Realtime Server

좋은 웹페이지 즐겨찾기