一、网络基础
1、TCP连接的三次握手
第一次：客户端发送包给服务器，等待服务器确认
第二次：服务器接收包，确认客户端，同时发送一个包给客户端
第三次：客户端接收包，同时发送确认包给服务器，此包发送完毕即完成三次握手
2、socket原理
socket（套接字）是支持TCP/IP协议的网络通信的基本操作单位，包含五种信息：连接使用的协议、本地主机的IP地址、本地进程的协议端口、远地主机的IP地址、远地进程的协议端口，socket解决的就是进程之间的通信，可以看到有了这些信息就可以分辨不同的进程，从而通信。建立socket连接至少需要一对套接字，一个运行在客户端，称为ClientSocket，另一个运行在服务器端，称为ServerSocket，连接分为服务器监听、客户端请求、连接确认三个步骤。第一个步骤服务器进行实时监控网络状态，不定位具体的套接字；第二个步骤客户端提出请求，这个套接字需要描述的是需要连接的服务器的套接字，指出服务器套接字的地址和端口号；第三个步骤响应请求，服务器建立一个新的进程，同时把套接字发给客户端，客户端确认后双方就建立了连接，而此时服务器再次处于监听，继续接受其他客户端的请求。
我们知道HTTP连接是一种“短连接”，采用的是“请求-响应”的方式，也就是说只有客户端请求了数据，服务端才会响应数据。如果服务端有了新的数据，没有客户端的请求这些数据是不会传给客户端的。而socket连接则是数据的传递是实时发生在双方的连接状态中的，但是防火墙会关闭非活跃的socket连接，因此需要通过轮询告诉网络，连接是处于活跃状态的，如果两个连接结合就可以定时向服务端发送请求，既保持了客户端在线，也可以在服务端有新数据的时候传递给客户端。
二、创建简单的聊天程序
以下仅仅是socket.io的示例程序。
1、引入相关模块
const express = require('express');
const app = express();
const path = require('path');
const http = require('http').Server(app);
const io = require('socket.io')(http);
2、设置静态资源和监听端口
app.use(express.static(path.join(__dirname,"static")));
app.get('/', function(req, res) {
res.sendFile(__dirname + '/index.html');
});
http.listen(3001, function(){
console.log('listening port 3001');
});
3、socket监听用户连接和端口
io.on('connection', function(socket){
console.log('a user connected');
socket.on('disconnect', function() {
console.log('user disconnected');
});
socket.on('chat', function(msg){
console.log(msg);
io.emit('chat', msg);
});
});
这里通过事件来监听，事件名可以自定义，这里只是通过这个名字来做出不同响应，我们可以看到on是监听，emit为触发，可以理解为向客户端发送套接字，所以我们同样需要在客户端确认请求。
4、客户端的书写
<!doctype html>
<html>
<head>
<title>忽如寄的聊天室</title>
<link rel="stylesheet" href="/index.css">
</head>
<body>
<ul id="messages"></ul>
<form action="">
<input id="m" autocomplete="off" />
<button>Send</button>
</form>
<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<script>
var socket = io();
$('form').submit(function(){
socket.emit('chat', $('#m').val());
$('#m').val('');
return false;
});
socket.on('chat', function(msg){
$('#messages').append($('<li>').text(msg));
});
</script>
</body>
</html>
我们在这里也可以看到emit和on作为触发和监听，当用户提交聊天信息后，触发chat，服务器监听到了请求后响应，接着服务器触发chat，客户端监听到了，作出响应，我们可以看到这对应的就是socket的整个连接过程。
我们如果有几个人通过浏览器同时访问，发送信息就可以聊天了。
更加详细的说明你可以在Socket.io官网中的示例看到。
网友评论