美文网首页
express4+Socket.io的封装问题

express4+Socket.io的封装问题

作者: njzwj | 来源:发表于2017-02-13 18:15 被阅读483次

    阅读本文前……

    建议访问http://socket.io/get-started/chat/先大致了解如何构建一个基于Node.js+express+socket.io的简易聊天室之后再阅读本文。

    最近做网络项目开发的时候需要使用到Socket.io,网站使用的是express4搭建的。如何将和Socket.io相关的代码分离,网上的资料比较少,http://socket.io/get-started/chat/这个页面上的样例将所有代码混杂在一起,并不适合在开发中使用。我在这里先提供一个思路。

    待解决的问题

    • Socket.io的配置代码如何从express自动生成项目中分离
    • 支持Socket.io的功能插件如何从Socket.io的配置代码中分离

    首先用express-generator生成express4项目。并且用npm在项目中安装socket.io。项目文件夹的结构如下

    bin/
      www
    model/
      chatcore.js
    node_modules/
    public/
    routes/
      index.js
    views/
      chatroom/
        chat.pug
    app.js
    socketio.js
    package.js
    

    Socket.io的封装

    第一步,新建socketio.js,将socketio相关配置写入

    // socketio.js
    var socketio = {};
    var socket_io = require('socket.io');
    
    //获取io
    socketio.getSocketio = function(server){
      var io = socket_io.listen(server);
    };
    
    module.exports = socketio;
    

    第二步,修改bin/www,启动服务器端服务

    // bin/www
    /**
     * Module dependencies.
     */
    
    var app = require('../app');
    var debug = require('debug')('chatroom:server');
    var http = require('http');
    // 添加此段内容以引入socketio
    var io = require('../socketio');
    // ...
    
    /**
     * Create HTTP server.
     */
    
    var server = http.createServer(app);
    
    // 添加此段内容启动 Socket.io
    io.getSocketio(server);
    
    // ...
    

    此时前端页面可从http://localhost:3000/socket.io/socket.io.js加载前端部分的socketio代码,前端内容可以参照http://socket.io/get-started/chat/创建。

    启动基于Socket.io的服务(以聊天室为例)

    这里只讲解后台部分的代码。
    假如我们需要启动一个简易聊天室服务,我们可以把聊天室的业务放在socketio.js当中(虽然这不是一个好主意):

    // socketio.js
    var socketio = {};
    var socket_io = require('socket.io');
    
    //获取io
    socketio.getSocketio = function(server){
      var io = socket_io.listen(server);
    
      // 聊天室 
      // 从http://socket.io/get-started/chat/上寻求更多帮助
      io.on('connection', function(socket) {
        console.log('a user connected');
        socket.on('chat message', function(msg){
          io.emit('chat message', msg);
        });
        socket.on('disconnect', function(){
          console.log('user disconnected');
        });
      });
    };
    
    module.exports = socketio;
    

    分离聊天室业务和socket.io配置

    下面将聊天室业务代码分离,在model/(如果没有的话就新建一个)下创建chatcore.js,并加入如下内容:

    // model/chatcore.js
    var chatcore = {};
    
    /**
     * chatroom app
     */
    chatcore.init = function(io) {
      io.on('connection', function(socket) {
        console.log('a user connected');
        socket.on('chat message', function(msg){
          io.emit('chat message', msg);
        });
        socket.on('disconnect', function(){
          console.log('user disconnected');
        });
      });
    };
    
    module.exports = chatcore;
    

    socketio.js修改为:

    // socketio.js
    var socketio = {};
    var socket_io = require('socket.io');
    var chatcore = require('./model/chatcore');
    
    //获取io
    socketio.getSocketio = function(server){
      var io = socket_io.listen(server);
      // Start chatroom app
      chatcore.init(io);
    };
    
    module.exports = socketio;
    

    如果有更多的应用模块,可以以相同的方式安排代码。

    欢迎讨论。

    相关文章

      网友评论

          本文标题:express4+Socket.io的封装问题

          本文链接:https://www.haomeiwen.com/subject/epltwttx.html