nodejs에서 웹소켓 통신 기능을 구현하는 방법-JS 튜토리얼-php.cn

nodejs에서 웹소켓 통신 기능을 구현하는 방법

亚连

풀어 주다： 2018-06-12 11:54:19

원래의

1509명이 탐색했습니다.

이 글에서는 websocket 통신 기능을 구현하기 위해 nodejs를 소켓.io와 결합하는 방법을 주로 소개하며, websocket 통신을 구현하기 위해 nodejs와 소켓.io를 결합한 관련 작업 기술을 예시로 분석합니다. 이 글의 예시를 참고하세요

nodejs와 소켓.io를 결합하여 웹소켓 통신 기능을 구현하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 세부 사항은 다음과 같습니다.

프로젝트에 백그라운드 데이터의 실시간 획득이 필요한 시나리오가 있기 때문에 이전에는 http 하트비트 요청 방법이 사용되었습니다. websocket은 이 모드에 비해 성능이 크게 향상되고 실시간 성능도 향상시킬 수 있기 때문에 websocket에 대한 연구가 진행되어 왔습니다. 이는 nodejs+socket.io를 사용하여 구현됩니다.

목표 달성

원래 백그라운드 데이터 하트비트 요청 방식을 백그라운드 소켓 연결을 통한 통합 푸시 방식으로 수정했습니다. 백그라운드 데이터는 다른 프로세스에 의해 파일이나 Redis에 기록됩니다. 여기서 구현되는 것은 파일을 읽는 방법입니다.

사전 준비

nodejs 설치(생략)

서버측

새 프로젝트 디렉토리를 생성하세요. 여기는 소켓테스트입니다
sockettest 디렉토리에 들어가서 express 모듈과 소켓io 모듈을 설치하세요

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

로그인 후 복사

새 package.json 파일에 다음 내용을 작성하세요.

{
 "name": "socket-test",
 "version": "0.0.1",
 "description": "my first socket.io app",
 "dependencies": {
  "express": "^4.10.2",
  "socket.io": "^1.7.2"
 }
}

로그인 후 복사

여기서는 사용되지 않으므로 기본 액세스 표시 페이지로 사용되는 새 index.html을 만듭니다. 내용은 임의입니다.
새로 만듭니다. Trends.js 파일을 만들고 그 안에 내용을 작성하세요. ：

var app = require(&#39;express&#39;)();
var http = require(&#39;http&#39;).Server(app);
var io = require(&#39;socket.io&#39;)(http);
var fs = require(&#39;fs&#39;);
#默认打开文件
app.get(&#39;/&#39;, function(req, res){
  res.sendfile(&#39;index.html&#39;);
});
#用于存储所有socket以广播数据
var iolist = [];
#定义socket on connection（连入）事件行为
io.on(&#39;connection&#39;, function(socket){
  #将连入socket加入列表
  iolist.push(socket); 
  #记录index，在disconnect（断开连接）发生时将对应的socket删除
  var sockex = iolist.indexOf(socket); 
  #定义on disconnect事件行为
  socket.on(&#39;disconnect&#39;, function(){
    #将断开连接的socket从广播列表里删除
    iolist.splice(sockex, 1);
  });
});
# 数据广播进程:每1秒钟广播一次
setInterval(function() {
  # 如果没有正在连接的socket，直接返回；
  if (iolist.length <= 0) return;
  var trends = fs.readFileSync(&#39;./data/trends.json&#39;,&#39;utf-8&#39;);#trends数据
  var coins = fs.readFileSync(&#39;./data/coins.json&#39;,&#39;utf-8&#39;);#coins数据
  #向所有socket连接发送数据
  for (i in iolist) {
    # 向客户端发送trends数据
    iolist[i].emit(&#39;trends&#39;, trends);
    # 向客户端发送coins数据
    iolist[i].emit(&#39;coins&#39;, coins);
  }
}, 1000);
# 服务器侦听在sockettest.com的3000端口上
http.listen(3000, function(){
  # 输出到标准输出
  console.log(&#39;listening on sockettest.com:3000&#39;);
});

로그인 후 복사

새 데이터 디렉터리를 만들고, 아래에 두 개의 새 파일인 Trend와 Coin을 만들어 소켓 서버에서 읽을 데이터를 저장합니다.
새 공용 디렉터리를 만들고 그 안에 index.html이라는 새 파일을 만듭니다. 파일 내용은 다음과 같습니다.

<!--引入必要的js文件-->
<script type="text/javascript" src="http://sockettest:3000/socket.io/socket.io.js"></script>
<script type="text/javascript">
    //新建socket
    var socket = io(&#39;http://sockettest.com:3000&#39;);
    socketdata(socket);
    function socketdata() {
      #定义接收到coins类型数据时的行为
      socket.on(&#39;coins&#39;, function(msg){
        console.log(msg);
      }
      #定义接收到trends类型数据时的行为
      socket.on(&#39;trends&#39;, function(msg){
        console.log(msg);
      }
    }
</script>

로그인 후 복사

코드 배포

두 개의 index.html 파일을 만든 이유는 다음과 같습니다. 웹 프로젝트에서는 nodejs에서 제공하는 소켓 서비스를 사용합니다. 이러한 방식으로 nginx나 tomcat과 같은 다른 서버에 public/index.html을 배포한 다음 루트 디렉터리에서 소켓 서버를 시작하여 소켓 서비스를 제공할 수 있습니다.
먼저 지금 프로젝트의 루트 디렉터리에서