node+socket.io+nginx配置实现聊天页面

2,938 阅读1分钟

socket.io

socket.io官网文档

服务端

服务端主要实现一个信息转发站,类似于:信息a -> server -> 信息b 流程的工作。

  1. 创建一个文件夹 demo,在其文件夹下运行npm init 初始化一个工程。
  2. 安装express,socket.io模块 npm install express@4.15.2 ; npm install socket.io
  3. index.js代码,实现一个简单的服务:
const { Server } = require('http');
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
var port = process.env.PORT || 3200;
io.on('connection', function(socket){  // 监听连接
  socket.on('message', function(msg){  //   监听 message
    io.emit('message', msg)  //发送信息
  });
});
http.listen(port, function(){   // 开启端口号为 port 的服务
  console.log('listening on *:' + port);
});

客户端

接收服务端发送下来的信息以及用户发送信息。创建一个静态index.html即可: 主要代码:

// 引用
<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
<script>
var socket = io('http://localhost:3200'); // 创建连接
if ( socket ) {
		socket.on('message', (msg)=>{ // message 跟 服务的一致。接收信息
				console.log('message:' ,msg)
		})
}

// 发送信息
socket.emit('message', 'hi');
</script>

代码

nginx 部署

安装node

wget https://nodejs.org/dist/v12.18.1/node-v12.18.1-linux-x64.tar.xz   
tar xf node-v12.18.1-linux-x64.tar.xz                                
cd node-v12.18.1-linux-x64                                             

配置node环境

cp /etc/profile /etc/profile.bak
export PATH=$PATH:/root/node-v12.18.1-linux-x64/bin
source /etc/profile

测试环境

node -v

运行服务端

将服务端代码放置服务器

安装forever

npm install forever -g
forever start index.js //开启
forever stop index.js // 停止

配置nginx文件

# 80端口
location /socket.io/ {
        proxy_http_version 1.1; #必要的
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
	   proxy_pass http://127.0.0.1:3200;   
  }

客户端io连接:

socket =  io('wss://域名/');