php socketio教程,使用socket.io如何实现聊天室

这篇文章主要介绍了使用socket.io实现简单聊天室案例，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了socket.io实现简单聊天室的具体代码，供大家参考，具体内容如下

1、客户端【index.html】代码：

socket简例

---

• {{item.name}}说：{{item.content}}

发送

var _vm = new Vue({

data :　{

name : '用户',

msg : '',

msgs : [],

},

methods : {

m_send : function() {

// 向客户端发送消息

socket_client.emit('say_client', {

name : this.name,

content : this.msg

}) ;

this.msg = '' ;

}

}

}).$mount('#app') ;

// socket服务器

var socket_client = io.connect('http://127.0.0.1:3000') ;

/**

* 监听服务端发来的消息

*

* 1、“say_server”是客户端发出信息时的key值

* 2、“res”是客户端传来的value值

*/

socket_client.on('say_server' ,function(res){

console.log('服务端发来的消息为：', res) ;

_vm.msgs.push(res);

});

2、服务端【app.js】代码：const http = require('http') ;

const server = http.createServer() ;

// web服务器

const express = require('express') ;

const app = express();

app.use(express.static(__dirname + '/public'));

app.listen(8888, function () {

console.log('web服务器成功启动了，IP：127.0.0.1，端口号：8888') ;

});

// socket服务器

const socketio = require('socket.io') ;

const socket_server = socketio(server) ;

// 建立和客户端的socket连接

socket_server.on('connection', function(client) {

// console.log(client) ; // 查看连接进来的客户端对象内容

// console.log(Object.keys(client)) ; // 查看连接进来的客户端对象的关键key值

/**

* 监听客户端发来的消息

*

* 1、“say_client”是客户端发出信息时的key值

* 2、“res”是客户端传来的value值

*/

client.on('say_client', function(res) {

console.log('客户端发来的消息为：', res) ;

// 向客户端发送消息

socket_server.emit('say_server', res) ;

}) ;

}) ;

server.listen(3000, function() {

console.log('socket服务器成功启动了，IP：127.0.0.1，端口号：3000') ;

}) ;

上面是我整理给大家的，希望今后会对大家有帮助。

相关文章：