Warm tip: This article is reproduced from serverfault.com, please click
node.js socket.io

Socket.io sequence of calls unclear

发布于 2020-11-30 01:14:02

Iḿ doing a socket.io, Node project and I dont understand the squence of calling the functions. I have the following code for the server:

//Socket setup
var io = require('socket.io')(http);
var c= [];

//functions
function y(clientid){
    console.log('Show clients: '+c)
}

var x = function(socketid, fn) {
    var customid = y(socketid)
    console.log('x is calling');
    fn(customid);
};


io.on('connection', (socket) => {
    console.log('User connected with %s', socket.id);

    socket.on('storeClientInfo', function (data) {
        console.log('Thought this would be the first call')
        //clients.push here
    });
    
    
    x(socket.id, function(socketid, ) {
        socket.emit('random', {
            test1: 'test1',
            test2: 'test1'
        });

    });
});

My code for the client is:

var socket = io();

        socket.on('connect', function () {
            socket.emit('storeClientInfo', { customId:Math.floor(Math.random() * 100 + 1 )});
        });

        socket.on('random', function (message) {
              //display message here
        });

My console log outputs:


User connected with MH0WD_zNzVOzi_6oABAB
Show clients: 
x is calling
Thought this would be the first call

Now my question is: Why at first the method gets called an not the socket.on('storeClientInfo')?

Greetings

Questioner
Botsud
Viewed
0
分享
jfriend00 2020-11-30 10:52:47

Here's the sequence of events in time:

  1. Your socket setup code runs and registers the io.on('connection', ...) event handler.
  2. Your client attempts a connection and registers event handlers for both the connect and random events on that socket. Note: This socket is NOT yet connected. It's in the process of trying to connect.
  3. The server receives the connection and the connection event on the server is called.
  4. You output the result of console.log('User connected with %s', socket.id); and see User connected with MH0WD_zNzVOzi_6oABAB in the console.
  5. You then register the socket.on('storeClientInfo', ...) event handler for that newly connected socket.
  6. You then call x(socket.id, ...) which then calls y(...) which outputs Show clients: .
  7. y() finishes executing and then x() outputs x is calling.
  8. At this point the server-side connection logic is done.
  9. The client then receives it's connect event and you send a message to the server with socket.emit('storeClientInfo', ...).
  10. Your server receives the storeClientInfo event and the socket.on('storeClientInfo', ...) event handler runs and you output Thought this would be the first call.

Perhaps the part you didn't know about is that in the client, this code:

var socket = io();

is asynchronous. This just starts the process of connecting. The socket is not connected yet when this returns. There is a socket.io socket object available for you to register event handlers on, but it is not yet connected to the server. That's why you have to register an event handler for the connect event to see when it actually completes the connection.

热门帖子

1
我发布了一个自认为很厉害的 Java 参数校验组件，它几乎可以满足所有的参数校验场景，请各位 V 友发表一些看法
2
浙江联通 0 宽福利，我已经参加了。
3
求推荐好用的记账 app
4
肝了五一假期： iOS 平台的假期调休闹钟「休息日」，限时免费，没有内购
5
家用上行还有什么好玩的使用方法
6
​MES管理系统的生产模块与ERP有何差异
7
一个运维应该用什么方式去请教后台管理订单的同事关于他们部门的事情
8
尝试收个 iPhone 13 Pro Max
9
程序员 15w 接了一个公寓系统+小程序
10
Gigapixel AI: 简单易用的图片放大器

热门github

1
A multi-platform library for OpenGL, OpenGL ES, Vulkan, window and input
2
Dev tool that writes scalable apps from scratch while the developer oversees the implementation
3
shadcn/ui, but for Svelte. ✨
4
The Python Risk Identification Tool for generative AI (PyRIT) is an open access automation framework to empower security professionals and machine learning engineers to proactively find risks in their generative AI systems.
5
Performance-portable, length-agnostic SIMD with runtime dispatch
6
ZK Credo
7
OpenCodeInterpreter: Integrating Code Generation with Execution and Refinement
8
Joplin - the secure note taking and to-do app with synchronisation capabilities for Windows, macOS, Linux, Android and iOS.
9
Mamba is a new state space model architecture showing promising performance on information-dense data such as language modeling, where previous subquadratic models fall short of Transformers. It is based on the line of progress on structured state space models, with an efficient hardware-aware design and implementation in the spirit of FlashAttention.
10
This repository contains System Design resources which are useful while preparing for interviews and learning Distributed Systems
11
Curso para aprender el lenguaje de programación Python desde cero y para principiantes. 75 clases, 37 horas en vídeo, código, proyectos y grupo de chat. Fundamentos, frontend, backend, testing, IA...
12
🎓 Path to a free self-taught education in Computer Science!
13
1️⃣🐝🏎️ The One Billion Row Challenge -- A fun exploration of how quickly 1B rows from a text file can be aggregated with Java
14
A collective list of free APIs
15
📚 Freely available programming books