socket.io聊天通信

安装:
 	npm i express
    npm i --save socket.io
# 服务端app.js中的代码
1.通过express的方式创建后端服务(必须这样写)
var app = require('express')()
var http = require('http').Server(express)
var io = require('socket.io')(http)

app.get('/', (req, res) => {
    res.sendFile(__dirname + '/index.html')
})

//connection是socket的默认创建连接方法
io.on('connection', (socket) => {
     console.log('用户连接成功')
    //socket.emit() 方法触发创建一个send方法并携带参数,让客户端socket.on()方法接收并执行send函数
    socket.emit('send', {dta: '服务端向客户端发送的数据'})
    //socket.on() 方法通过接收到客户端创建的msg方法并关执行
    socket.on('msg', data => console.log(data))
})

http.listen(3000, () => {
    console.log('3000服务启动')
})
# 客户端index.html中的方法
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>socketIO聊天室</title>
</head>
<body>
    <input id="ipt" type="text">
    <button id="btn">发送</button>
</body>
</html>
//1.引入socket.io
<script src="/socket.io/socket.io.js"></script>
<script>
    //2.创建socket对象
    var socket = io('http://127.0.0.1:3000')
    var ipt = document.getElementById('ipt')

    //客户端通过socket.emit方法触发创建send方法并携带参数
    socket.emit('send', { dta: '客户端向服务端发送的dta数据' })

    //客户端用socket.on方法监听msg这个函数并执行
    socket.on('msg', data => {
        console.log(data)
    })
</script>
//socket封装的断开连接的方法
socket.on('disconnect',data => {})
// PS:
	textarea添加一个属性:contenteditable 可编辑固定标签内的文本
   	一般用来做聊天输入框
上一篇:分组后获取最新记录信息


下一篇:自顶向下的计算机网络作业——邮件客户实验题