实时通信Socket io的使用示例详解
Socket.io是一个基于WebSockets的实时通信协议，可以让浏览器和服务器之间建立长连接，实现实时的双向通信。下面将详细介绍Socket.io使用示例。
安装Socket.io
首先需要在服务器环境中安装Socket.io。可以通过npm进行安装，执行以下命令：
npm install socket.io
安装完成后，就可以在代码中引入Socket.io库了。
服务端代码示例
以下是一个简单的使用Node.js作为服务器，在服务端代码中使用Socket.io的示例：
const http = require('http');
const socketio = require('socket.io');
const server = http.createServer((req, res) => {
res.writeHead(200);
res.end();
});
const io = socketio(server);
io.on('connection', (socket) => {
console.log('A user connected');
socket.on('message', (message) => {
console.log(`Received message: ${message}`);
io.emit('message', message);
});
socket.on('disconnect', () => {
console.log('A user disconnected');
});
});
const PORT = process.env.PORT || 3000;
server.listen(PORT, () => {
console.log(`Server listening on port ${PORT}`);
});
以上代码中，首先创建了一个Node.js服务器，并通过Socket.io库实例化了一个socket.io服务器实例。当有用户连接到服务器时，通过connection事件回调函数，获取客户端的socket，并监听其message事件，当收到客户端发送的消息时，将消息通过io.emit方法广播给所有已连接的客户端。
客户端代码示例
以下是一个简单的使用Socket.io在客户端建立连接，发送消息和接收消息的示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Socket.io client example</title>
</head>
<body>
<input type="text" id="input"/>
<button id="send">Send</button>
<ul id="messages"></ul>
<script src="/socket.io/socket.io.js"></script>
<script>
const socket = io();
document.querySelector('#send').addEventListener('click', () => {
const input = document.querySelector('#input');
const message = input.value.trim();
input.value = '';
socket.emit('message', message);
});
socket.on('message', (message) => {
const li = document.createElement('li');
li.textContent = message;
document.querySelector('#messages').appendChild(li);
});
</script>
</body>
</html>
以上代码实现了一个简单的聊天应用，页面中有一个输入框和一个发送按钮，当用户点击发送按钮时，通过Socket.io发送消息给服务器，服务器通过广播的方式将消息发送给所有的客户端，客户端收到消息后将其添加到页面上。
总结
以上就是一个简单的使用示例，Socket.io的使用可以通过事件回调函数来处理各种请求和响应，非常灵活。Socket.io的使用场景非常广泛，如实时聊天、实时位置共享、实时数据展示等等。
本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：实时通信Socket io的使用示例详解 - Python技术站
微信扫一扫 
支付宝扫一扫 