1. 소개
우선, socket.io의 공식 웹 사이트 : http://socket.io
공식 웹 사이트는 매우 간결하며 API 문서도없고 간단한 "사용 방법"만 참조하십시오. socket.io는 공식 웹 사이트만큼 간단하고 사용하기 쉽기 때문입니다.
그래서 socket.io는 무엇입니까? Socket.io는 클라이언트 측 JS 및 서버 측 NODEJ를 포함하는 WebSocket 라이브러리입니다. 목표는 다른 브라우저와 모바일 장치에서 사용할 수있는 실시간 응용 프로그램을 구축하는 것입니다. WebSocket, Ajax Long Polling, Iframe Streaming 등과 같은 다양한 방법의 브라우저를 기반으로 실시간 네트워크 응용 프로그램을 실현하는 가장 좋은 방법을 자동으로 선택합니다. 이는 매우 편리하고 사용자 친화적입니다. 지원되는 브라우저는 IE5.5만큼 낮으므로 대부분의 요구를 충족해야합니다.
2. 설치 및 배포
2.1 설치
우선, Node.js 환경에서 설치는 매우 간단합니다.
코드 사본은 다음과 같습니다.
NPM Socket.io 설치
2.2 Express를 결합하여 서버를 빌드합니다
Express는 작은 Node.js Web Application Framework로, HTTP 서버를 구축 할 때 종종 사용되므로 Socket.io로 직접 설명하고 표현으로 설명됩니다.
코드 사본은 다음과 같습니다.
var express = 요구 사항 ( 'Express')
, app = express ()
, server = require ( 'http'). CreateServer (app)
, io = require ( 'socket.io'). 듣기 (서버);
Server.Listen (3001);
Express를 사용하지 않으면 socket.io/#how-to-use를 참조하십시오.
3. 기본 사용법
주로 두 가지 코드로 나뉩니다 : 서버 측 및 클라이언트 측면은 모두 매우 간단합니다.
서버 (app.js) :
코드 사본은 다음과 같습니다.
// 위 코드를 연결합니다
app.get ( '/', function (req, res) {
res.sendfile (__ dirname + '/index.html');});
io.sockets.on ( 'Connection', function (socket) {
socket.emit ( 'News', {hello : 'world'});
socket.on ( '기타 이벤트', 함수 (데이터) {
Console.log (데이터);
});
});
먼저, io.sockets.on 함수는 클라이언트가 연결을 시작하는 이벤트로 문자열 "Connection"을 허용합니다. 연결이 성공하면 소켓 매개 변수가있는 콜백 기능이 호출됩니다. Socket.io를 사용하면 기본적 으로이 콜백 기능에서 사용자 요청을 처리합니다.
소켓에서 가장 중요한 것은 방출입니다. 전자는 이벤트 (이벤트 이름은 문자열로 표시)를 제출합니다 (문제). 이벤트 이름은 사용자 정의 할 수 있으며 일부 기본 이벤트 이름이 있고 객체가 있으며 소켓으로 전송 된 콘텐츠를 나타냅니다. 후자는 이벤트를 받고 (이벤트 이름은 문자열로 표시), 데이터가 수신 된 데이터 인 이벤트 호출을 수신하는 콜백 함수가 이어집니다.
위의 예에서는 뉴스 이벤트를 보냈고 다른 이벤트 이벤트를 받았으므로 고객은 해당 수신 및 전송 이벤트를 가져야합니다. 예, 클라이언트 코드는 정확히 반대이며 서버와 매우 유사합니다.
클라이언트 (client.js)
코드 사본은 다음과 같습니다.
<script src = "/socket.io/socket.io.js"> </script>
<cript>
var socket = io.connect ( 'http : // localhost');
socket.on ( '뉴스', 기능 (데이터) {
Console.log (데이터);
socket.emit ( '기타 이벤트', {my : 'data'});
});
</스크립트>
주목해야 할 두 가지가 있습니다. socket.io.js 경로를 올바르게 작성해야합니다. 이 JS 파일은 실제로 서버 측의 Node_Modules 폴더에 배치됩니다. 이 파일을 요청할 때 리디렉션됩니다. 따라서이 파일이 서버 측에 존재하지 않고 여전히 정상적으로 작동하는 이유에 놀라지 마십시오. 물론 Server-Side Socket.io.js 파일을 로컬로 복사하여 클라이언트 측 JS 파일로 만들 수 있으므로 매번 노드 서버 에서이 JS 파일을 요청할 필요가 없으므로 안정성이 향상됩니다. 두 번째 요점은 var socket = io.connect ( '웹 사이트 주소 또는 ip')를 사용하는 것입니다. 소켓 객체를 얻으려면 소켓을 사용하여 이벤트를 보내고받을 수 있습니다. 이벤트 처리와 관련하여 위의 코드는 "뉴스"이벤트를 수신 한 후 수신 된 데이터가 인쇄되고 "기타 이벤트"이벤트가 서버로 전송됨을 의미합니다.
참고 : "Disternect"와 같은 내장 기본 이벤트 이름은 클라이언트 연결이 연결이 끊어 졌음을 의미합니다. "메시지"는 메시지가 수신되었음을 의미합니다. 사용자 정의 이벤트 이름의 경우 불필요한 문제를 일으키지 않도록 Socket.io가 내장 된 기본 이벤트 이름으로 이름을 두 배로 늘리지 마십시오.
4. 다른 일반적인 API
1). 모든 클라이언트에게 방송 : socket.broadcast.emit ( '방송 메시지');
2). 방에 입력하십시오 (사용하기가 매우 쉽습니다! 네임 스페이스와 동일하며, 다른 방에서 고객에게 영향을 미치지 않거나 방에없는 특정 객실로 방송 될 수 있음) : Socket.join ( '객실 이름');
3). 방에 방송 메시지 (발신자가 메시지를받을 수 없음) : socket.broadcast.to ( 'room room name'). emit ( '방송실 메시지');
4). 방에 방송 메시지 (발신자가 메시지를받을 수 있음) (이 API는 io.sockets에 속합니다) : io.sockets.in ( '다른 방 이름'). emit ( '방송실 메시지');
5). WebSocket Communication : (클라이언트) socket.send ( 'hi'), (Server) Socket.on ( 'message', function (data) {})를 사용하여 수신합니다.
5. socket.io를 사용하여 대화방을 구축하십시오
마지막으로, 우리는이 기사를 간단한 예로 끝냅니다. Socket.io를 사용하여 대화방을 구축하는 것은 약 50 줄의 코드이며 실시간 채팅 효과도 매우 좋습니다. 다음 주요 코드가 게시됩니다.
서버 (socketchat.js)
코드 사본은 다음과 같습니다.
// 클라이언트가 서버에 연결할 때 클라이언트 연결을위한 사전,
// 고유 한 socketID가 생성되고 사전은 SocketID를 사용자 정보 (닉네임 등)에 매핑합니다.
var connectionList = {};
Exports.startchat = function (io) {
io.sockets.on ( 'Connection', function (socket) {
// 클라이언트가 연결할 때 SocketID 및 사용자 이름을 저장합니다
var socketid = socket.id;
ConnectionList [SocketID] = {
소켓 : 소켓
};
// 사용자는 채팅방 이벤트를 입력하고 다른 온라인 사용자에게 사용자 이름을 방송합니다.
socket.on ( 'join', function (data) {
socket.broadcast.emit ( 'broadcast_join', data);
ConnectionList [SocketID] .username = data.username;
});
// 사용자는 채팅방 사고를 떠나 다른 온라인 사용자에게 출발을 방송합니다.
Socket.on ( 'Disponnect', function () {
if (ConnectionList [SocketID] .username) {
socket.broadcast.emit ( 'broadcast_quit', {
사용자 이름 : ConnectionList [SocketID] .username
});
}
ConnectionList 삭제 [SocketID];
});
// 사용자 음성 사고, 다른 온라인 사용자에게 연설 내용을 방송합니다.
socket.on ( 'say', function (data) {
socket.broadcast.emit ( 'broadcast_say', {
사용자 이름 : ConnectionList [SocketID] .username,
텍스트 : data.text
});
});
})
};
클라이언트 (socketchatclient.js)
코드 사본은 다음과 같습니다.
var socket = io.connect ( 'http : // localhost');
// 서버에 연결 한 후 즉시 "조인"이벤트를 제출하고 다른 사람에게 사용자 이름을 알려줍니다.
socket.emit ( 'join', {
사용자 이름 : '사용자 이름 hehe'
});
// 채팅방에 가입하는 방송을 받으면 메시지가 표시됩니다.
socket.on ( 'broadcast_join', function (data) {
console.log (data.username + '채팅방에 추가);
});
// 채팅방을 떠나 방송을받은 후 메시지가 표시됩니다.
socket.on ( 'broadcast_quit', function (data) {
console.log (data.username + '채팅방을 떠나십시오');
});
// 다른 사람이 전송 한 메시지를 받으면 메시지가 표시됩니다.
socket.on ( 'broadcast_say', function (data) {
console.log (data.username + 'say :' + data.text);
});
// 여기에 우리는 텍스트 상자 textArea와 보내기 버튼이 있다고 가정합니다.
// jQuery를 사용하여 이벤트를 바인딩합니다
$ ( '. btn-send'). 클릭 (function (e) {
// 텍스트 상자의 텍스트를 가져옵니다
var text = $ ( 'textArea'). val ();
// 이벤트를 제출하면 서버가 수신되면 서버가 방송됩니다.
socket.emit ( 'say', {
사용자 이름 : '사용자 이름 hehe'
텍스트 : 텍스트
});
});
이것은 원하는대로 확장 할 수있는 간단한 대화방 데모입니다. Socket.io는 기본적으로 다양한 이벤트의 제출 및 수신 처리이며 아이디어는 매우 간단합니다.