웹 프론트엔드 JS 튜토리얼 node.js의 소켓.io 학습 튜토리얼 소개(2)

node.js의 소켓.io 학습 튜토리얼 소개(2)

May 03, 2017 am 10:02 AM

Socket.io는 이벤트를 기반으로 실시간 양방향 통신을 제공합니다. 다음 기사에서는 소켓.io의 기본 응용 프로그램에 대한 관련 정보를 주로 소개하며 필요한 모든 사람이 읽을 수 있는 학습 가치가 있습니다. 함께 보세요.

머리말

Socket.IO는 시기적절한 양방향 이벤트 기반 통신을 지원합니다. 모든 플랫폼, 모든 브라우저, 모든 장치에서 동일한 안정성과 속도로 작동합니다.

  • 실시간 분석: 실시간 카운터, 차트 또는 로그 클라이언트로 표시되는 클라이언트에 데이터를 푸시합니다.

  • 실시간 통신 및 채팅: Socket.IO "Hello, World" 채팅 애플리케이션을 작성하려면 코드 몇 줄만 있으면 됩니다.

  • 바이너리 스트리밍 전송: 버전 1.0부터 Socket.IO는 사진, 비디오, 오디오 등 모든 형태의 바이너리 파일 전송을 지원합니다.

  • 문서 병합: 여러 사용자가 동시에 문서를 편집하고 각 사용자가 변경한 내용을 볼 수 있습니다.

서버 및 클라이언트 연결

socket.io는 서버 및 클라이언트 연결 API를 모두 제공합니다

서버 소켓.io는 http.Server 인스턴스를 바인딩해야 합니다

http.Server 바인딩

1. 암시적 바인딩

은 인스턴스화할 때 포트를 전달하거나 인스턴스화 후 청취 또는 연결 기능을 호출하여 암시적으로 바인딩됩니다. Socket.io는 내부적으로 http.Server

을 인스턴스화하고 수신합니다. 인스턴스화할 때 수신 포트

let io = require('socket.io')(3000)
로그인 후 복사

는 수신 또는 연결 기능을 통해 직접 바인딩됩니다. Listen과 ​​Attach는 동의어입니다

let io = require('socket.io') 
io.listen(3000) // io.attach(3000)
로그인 후 복사

2. 디스플레이 바인딩

인스턴스화할 때 바인딩할 http.Server

를 수동으로 지정할 수 있습니다

let server = require('http').Server(); 
let io = require('socket.io')(server)

server.listen(3000)
로그인 후 복사

바인딩

let server = require('http').Server(); 
let io = require('socket.io')()

io.listen(server) // io.attach(server)

server.listen(3000)
로그인 후 복사

Listen 또는 Attach를 통해 express 또는 koa

express

let app = require('express') 
let server = require('http').Server(app) 
let io = require('socket.io')(server)

app.listen(3000)
로그인 후 복사

koa

let app = require('koa')() 
let server = require('http').Server(app.callback())

let io = require('socket.io')(server)

app.listen(3000)
로그인 후 복사

<🎜와 같은 http 프레임워크를 바인딩할 수 있습니다. >연결 상태 모니터링

서버와 클라이언트가 성공적으로 연결되면 서버는 연결 및 연결 이벤트를 수신하고(연결과 연결은 동의어입니다) 클라이언트는 연결이 끊어지면 클라이언트에 해당하는 서버의 소켓과 클라이언트가 모두 연결 끊김 이벤트를 모니터링합니다.

서버 코드

let server = require(&#39;http&#39;).Server() 
let io = require(&#39;socket.io&#39;)(server)

server.listen(3000); 
io.on(&#39;connection&#39;, socket => { 
 console.log(&#39;connect&#39;)
 socket.on(&#39;disconnect&#39;, () => {
 console.log(&#39;disconnect&#39;)
 })
 socket.disconnect()
})
로그인 후 복사

실행 후 인쇄

connect 
disconnect
로그인 후 복사
로그인 후 복사

클라이언트 코드

let socket = io(&#39;http://localhost:3000&#39;) 
socket.on(&#39;connect&#39;, () => { 
 console.log(&#39;connect&#39;)
})
socket.on(&#39;disconnect&#39;, () => { 
 console.log(&#39;disconnect&#39;)
})
로그인 후 복사

실행 후 인쇄

connect 
disconnect
로그인 후 복사
로그인 후 복사

데이터 전송

서버 및 클라이언트 소켓 클라이언트 측에는 연관된 EventEmitter 객체가 있습니다. 클라이언트 소켓에서 보낸 이벤트는 서버 소켓에서 수신할 수 있으며, 서버 소켓에서 보낸 이벤트도 클라이언트에서 수락할 수 있습니다. 이 메커니즘을 기반으로 양방향 통신이 가능합니다.

이제 다음과 같은 상황을 시뮬레이션해 보세요. 클라이언트가 계속해서 난수를 보냅니다. 난수가 0.95보다 크면 서버는 1초를 지연한 다음 클라이언트에 경고와 경고 횟수를 보냅니다.

서버 코드

let server = require(&#39;http&#39;).Server() 
let io = require(&#39;socket.io&#39;)(server)

server.listen(3000); 
io.on(&#39;connection&#39;, socket => { 
 socket.on(&#39;random&#39;, value => {
 console.log(value)
 if (value > 0.95) {
  if (typeof socket.warning === &#39;undefined&#39;) socket.warning = 0
  setTimeout(() => {
  socket.emit(&#39;warn&#39;, ++socket.warning)
  }, 1000)
 }
 })
})
로그인 후 복사

소켓 개체는

socket.warning

클라이언트 코드

let socket = io(&#39;http://localhost:3000&#39;) 
let interval = setInterval(() => { 
 socket.emit(&#39;random&#39;, Math.random())
}, 500)
socket.on(&#39;warn&#39;, count => { 
 console.log(&#39;warning count: &#39; + count)
})
socket.on(&#39;disconnect&#39;, () => { 
 clearInterval(interval)
})
로그인 후 복사

와 같은 상태 정보 및 사용자 정의 데이터를 저장하는 데 사용할 수 있습니다. 전송 스트림

socket.io는 스트림을 처리할 수 있습니다

서버 코드

io.on(&#39;connection&#39;, function (socket) { 
 let stream = ss.createStream()
 ss(socket).emit(&#39;script&#39;, stream)
 fs.createReadStream(__filename).pipe(stream)
})
로그인 후 복사

클라이언트 코드

let socket = io(&#39;http://localhost:3000&#39;) 
ss(socket).on(&#39;script&#39;, stream => { 
 let buffer = &#39;&#39; 
 stream.on(&#39;data&#39;, data => {
 buffer += data.toString()
 })
 stream.on(&#39;end&#39;, () => {
 console.log(buffer)
 })
})
로그인 후 복사

위 내용은 node.js의 소켓.io 학습 튜토리얼 소개(2)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

Node의 메모리 제어에 관한 기사 Node의 메모리 제어에 관한 기사 Apr 26, 2023 pm 05:37 PM

Non-Blocking, Event-Driven 기반으로 구축된 Node 서비스는 메모리 소모가 적다는 장점이 있으며, 대규모 네트워크 요청을 처리하는데 매우 적합합니다. 대규모 요청을 전제로 '메모리 제어'와 관련된 문제를 고려해야 합니다. 1. V8의 가비지 수집 메커니즘과 메모리 제한 Js는 가비지 수집 기계에 의해 제어됩니다.

Node V8 엔진의 메모리와 GC에 대한 자세한 그래픽 설명 Node V8 엔진의 메모리와 GC에 대한 자세한 그래픽 설명 Mar 29, 2023 pm 06:02 PM

이 기사는 NodeJS V8 엔진의 메모리 및 가비지 수집기(GC)에 대한 심층적인 이해를 제공할 것입니다. 도움이 되기를 바랍니다.

최고의 Node.js Docker 이미지를 선택하는 방법에 대해 이야기해 볼까요? 최고의 Node.js Docker 이미지를 선택하는 방법에 대해 이야기해 볼까요? Dec 13, 2022 pm 08:00 PM

Node용 Docker 이미지를 선택하는 것은 사소한 문제처럼 보일 수 있지만 이미지의 크기와 잠재적인 취약점은 CI/CD 프로세스와 보안에 상당한 영향을 미칠 수 있습니다. 그렇다면 최고의 Node.js Docker 이미지를 어떻게 선택합니까?

Node의 파일 모듈에 대해 자세히 이야기해 보겠습니다. Node의 파일 모듈에 대해 자세히 이야기해 보겠습니다. Apr 24, 2023 pm 05:49 PM

파일 모듈은 파일 읽기/쓰기/열기/닫기/삭제 추가 등과 같은 기본 파일 작업을 캡슐화한 것입니다. 파일 모듈의 가장 큰 특징은 모든 메소드가 **동기** 및 ** 두 가지 버전을 제공한다는 것입니다. 비동기**, sync 접미사가 있는 메서드는 모두 동기화 메서드이고, 없는 메서드는 모두 이기종 메서드입니다.

Node.js 19가 공식적으로 출시되었습니다. Node.js의 6가지 주요 기능에 대해 이야기해 보겠습니다! Node.js 19가 공식적으로 출시되었습니다. Node.js의 6가지 주요 기능에 대해 이야기해 보겠습니다! Nov 16, 2022 pm 08:34 PM

Node 19가 정식 출시되었습니다. 이 글에서는 Node.js 19의 6가지 주요 기능에 대해 자세히 설명하겠습니다. 도움이 되셨으면 좋겠습니다!

Node.js의 GC(가비지 수집) 메커니즘에 대해 이야기해 보겠습니다. Node.js의 GC(가비지 수집) 메커니즘에 대해 이야기해 보겠습니다. Nov 29, 2022 pm 08:44 PM

Node.js는 GC(가비지 수집)를 어떻게 수행하나요? 다음 기사에서는 이에 대해 설명합니다.

Node의 이벤트 루프에 대해 이야기해 봅시다. Node의 이벤트 루프에 대해 이야기해 봅시다. Apr 11, 2023 pm 07:08 PM

이벤트 루프는 Node.js의 기본 부분이며 메인 스레드가 차단되지 않도록 하여 비동기 프로그래밍을 가능하게 합니다. 이벤트 루프를 이해하는 것은 효율적인 애플리케이션을 구축하는 데 중요합니다. 다음 기사는 Node.js의 이벤트 루프에 대한 심층적인 이해를 제공할 것입니다. 도움이 되기를 바랍니다!

노드가 npm 명령을 사용할 수 없으면 어떻게 해야 합니까? 노드가 npm 명령을 사용할 수 없으면 어떻게 해야 합니까? Feb 08, 2023 am 10:09 AM

노드가 npm 명령을 사용할 수 없는 이유는 환경 변수가 올바르게 구성되지 않았기 때문입니다. 해결 방법은 다음과 같습니다. 1. "시스템 속성"을 엽니다. 2. "환경 변수" -> "시스템 변수"를 찾은 다음 환경을 편집합니다. 3. nodejs 폴더의 위치를 ​​찾습니다. 4. "확인"을 클릭합니다.

See all articles