This article mainly introduces the sample code of node.js using socket to implement chatting. The editor thinks it is quite good, so I will share it with you now and give it as a reference. Let’s follow the editor to take a look, I hope it can help everyone.
Server setup
app.js
##
const http = require("http");
const express = require("./express");
//創(chuàng)建一個服務(wù)
const server = http.createServer(express);
//監(jiān)聽服務(wù)端口
server.listen(8001,()=>{
console.log("服務(wù)端已經(jīng)啟動,請訪問 http://localhost:8001");
});express.js
const url=require("url");
const fs=require("fs");
function express(req,res){
var urlObj=url.parse(req.url);
//console.log(urlObj);
var filePath="./www"+urlObj.pathname;
var content="not found";
if(fs.existsSync(filePath)){
content=fs.readFileSync(filePath);
}
res.end(content.toString());
}
module.exports=express;index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Socket.IO chat</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font: 13px Helvetica, Arial; }
form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
#messages { list-style-type: none; margin: 0; padding: 0; }
#messages li { padding: 5px 10px; }
#messages li:nth-child(odd) { background: #eee; }
</style>
</head>
<body>
<ul id="messages"></ul>
<form action="">
<input id="m" autocomplete="off" /><button>Send</button>
</form>
<script src="js/lib/jquery-1.11.1.js"></script>
<script src="js/lib/socket.io.js"></script>
<script src="js/index.js"></script>
</body>
</html>Client service establishment and server communication
We need to establish a server-side socket request connection
io.on('connection', function(socket){
console.log('a user connected');
//斷開連接
socket.on('disconnect', function(){
console.log('user disconnected');
});
});index.js
//客戶端建立連接
var socket = io();
客戶端向服務(wù)端發(fā)送請求
index.js
$('form').submit(function(){
//觸發(fā)事件
socket.emit('chat message', $('#m').val());
$('#m').val('');
return false;
});app.js
//接收客戶端的信息
socket.on('chat message', function(msg){
console.log('message: ' + msg);
});Broadcast the data from the server to the client
socket.on('chat message', function(msg){
console.log('message: ' + msg);
socket.broadcast.emit("clientE",msg);
});The client receives the data broadcast from the server
socket.on('clientE', function(msg){
$('#messages').append($('<li>').text(msg));
});Related recommendations:
nodejs implements WebSocket chat function based on WS module
jquery imitates WeChat Chat interface example sharing
Example detailed explanation of vue component parent-child communication chat room
The above is the detailed content of node.js uses socket to implement chat instance sharing. For more information, please follow other related articles on the PHP Chinese website!