> 웹 프론트엔드 > JS 튜토리얼 > node.js_javascript 클래스 라이브러리에서 소켓.io 시작하기

node.js_javascript 클래스 라이브러리에서 소켓.io 시작하기

WBOY
풀어 주다: 2016-05-16 16:51:00
원래의
1466명이 탐색했습니다.

웹소켓 및 기타 역방향 Ajax 기술 소개

실시간 웹 애플리케이션에서 일반적인 방식은 역Ajax입니다. 역방향 Ajax의 정의:

Reverse Ajax(Reverse Ajax)는 기본적으로 서버에서 클라이언트로 데이터를 보낼 수 있는 개념입니다. 표준 HTTP Ajax 요청에서 데이터는 서버로 전송됩니다. Reverse Ajax는 몇 가지 특정 방식으로 Ajax 요청을 시뮬레이션할 수 있습니다. 이러한 방법은 이 방법으로 서버가 서버에 데이터를 보낼 수 있습니다. 가능합니다. 클라이언트가 이벤트를 보냅니다(낮은 대기 시간 통신).

Reverse Ajax 기술에는 크게 두 가지 내용이 있습니다. 하나는 클라이언트에 보낼 데이터가 있을 때까지 서버가 TCP 연결을 유지하는 것이고(루프 및 절전 모드를 사용하여 구현할 수 있음), 다른 하나는 클라이언트 js 프로그래밍 기술입니다.

Websocket은 HTML5의 표준이자 Anti-Ajax 기술이기도 합니다.

Socket.io 역방향 AJAX 기술 구현 예시

socket.io 공식 소개:

Socket.IO는 모든 브라우저와 모바일 장치에서 실시간 앱을 구현하여 다양한 전송 메커니즘 간의 차이를 모호하게 만드는 것을 목표로 하며 모든 브라우저, 소켓에서 실시간 연결을 100% 제공합니다. IO는 API에 영향을 주지 않고 런타임에 가장 유능한 전송을 선택합니다. WebSocket Adobe® Flash® Socket AJAX 롱 폴링 AJAX 멀티파트 스트리밍 Forever Iframe JSONP 폴링

간단히 말하면, Socket.io는 nodejs 기반의 라이브러리로, 여러 Reverse Ajax 기술을 패키지하고 인터페이스를 통합합니다. 런타임 시, 소켓.io는 브라우저 조건에 따라 소켓.io 서버와 상호 작용하기 위해 적절한 역방향 Ajax 기술을 자동으로 선택합니다. websocket과 같은 기술이 표준이라면, 소켓.io는 애플리케이션입니다.

설치 방법은 다음과 같습니다(저자는 Linux Mint 16을 사용합니다).

node.js 설치:

코드 복사 코드는 다음과 같습니다.
sudo apt- get install nodejs

nodejs 명령을 입력하여 쉘 모드로 들어갑니다.

npm 설치:

코드 복사 코드는 다음과 같습니다.
sudo apt-get install npm

socket.io 설치:
코드 복사 코드는 다음과 같습니다.
sudo npm install 소켓.io

설치 패키지는 ~/node_modules 디렉터리에 저장되고, 클라이언트 소켓.io.js는 ~/node_modules/socket.io/node_modules/socket.io-에 저장됩니다. 클라이언트/dist 디렉토리.

socket.io 예

다음 예시는 공식 홈페이지에서 가져온 것이며 적절하게 수정되었습니다.

먼저 서버측(서버측) 코드(test.js 파일)를 생성합니다.

코드 복사 코드는 다음과 같습니다:

var io = require('socket.io').listen(8080);

io.sockets.on('connection', function (socket) {
socket.emit('news', { hello: 'world' });
socket.on('나의 다른 이벤트' , function (data) {
console.log(data);
});
});


서버 test.js는 포트 8080에 바인딩되어 있습니다. 클라이언트가 연결될 때 test.js 서버가 실행 중이면 test.js 서버는 클라이언트에 news 명령을 보내고 test.js 서버가 my other 이벤트 명령을 수신하면 콜백을 호출합니다. function function (data) { console.log(data);} 수신된 데이터를 처리합니다.

저자는 포트 80을 사용하고 웹 루트 디렉터리는 /usr/share/nginx/html인 nginx 서버를 구축했습니다. ~/node_modules/socket.io/node_modules/socket.io-client/dist 아래의 소켓.io.min.js를 웹 루트 디렉터리에 복사하고, 웹 루트 디렉터리에 (클라이언트로) index.php 파일을 생성합니다. 내용은 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

< ;head>



최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿