Node.js 在多个.js 文件中使用 socket.io

Question

I want to be able to write functions in multiple.js files and use the same socket that is create in my main server.js

server.js:

var express = require('express')
var app = express()
var http = require('http')
var server = http.createServer(app)
var io = require('socket.io')(server)
var GOR = require('./gor')
var path = require('path');
app.use(express.static(path.join(__dirname, '/public')));

//handles get request and serves index.html
app.get('/', function(req, res) {
    res.sendFile(__dirname + '/public/index.html');
});

//wait for server to start
server.listen(8080,()=>{
  console.log("server started");
  setInterval(emit_data,5000);
  emit_data();
  
  //setInterval(GOR.send_from_another_js,5000);
  //GOR.send_from_another_js(io);
})

function emit_data(){
    io.emit( 'update', "webserver.js");
}

As you can see from the code above, I have a function that emits to socket every 5 seconds and that works fine. I have confirmed it already.

All I want to do now, is to create a seperate.js file and keep all my functions there to make the code look cleaner. I name another.js file gor.js:

gor.js:

//I want to call this function in my webserver.js and transmit this socket
function send_from_another_js(io){
    console.log("function called");
    io.emit( 'update', "another_js");
}

module.exports = {
    send_from_another_js    
}

When I call this function in my server.js, it does not work:

server.listen(8080,()=>{
  console.log("server started");
  setInterval(GOR.send_from_another_js,5000);
  GOR.send_from_another_js(io);

})

What is correct way to use the same.io in other.js files? The above does not work.

EDIT1

In my.html, I wait for a message on socket:

window.addEventListener('DOMContentLoaded', () => {
    
    socket.on('update', function(number_to_set) {
    console.log("socket update received");
    document.getElementById('number1').innerHTML = number_to_set;

});
    
    var button = document.getElementById("operation_code_button");
    button.addEventListener("click", function(event){
    var val = document.getElementById("operation_code_input").value;
    console.log("socket clicked, emmiting data");
    socket.emit('button_click',val);
    
});

})

And in my.js file I emit to this socket every 5 seconds:

server.listen(8080,()=>{
    console.log("server started");
    setInterval(emit_data,5000);
    emit_data();
})

After 5 seconds, I can see that my webpage update data so everything works!!!

I want to declare the emit_data function inside another.js file and use it in my main.js file.

The function in my secondary.js file ( gor.js):

function send_from_another_js_1(io){
  io.emit( 'update', data);
}

I want to call it in my main.js the same way I call emit_data

Answer 1

Edited:(3) Trust it is what you are looking for...

"server.js"

const content = require('fs').readFileSync(__dirname + '/index.html', 'utf8');
const httpServer = require('http').createServer((req, res) => {
// serve the index.html file
res.setHeader('Content-Type', 'text/html');
res.setHeader('Content-Length', Buffer.byteLength(content));
res.end(content);
});

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

const apple = require("./File2.js")
apple.send_from_another_js_1(io);
apple.send_from_another_js_2(io);

var port = 3000; //wamp server
var prompt = 'Open browser at http://localhost:'
httpServer.listen(port, () => {
console.log(prompt, port);
});

"File2.js"

function send_from_another_js_1(io){
  io.on('connection', function (socket) {
  socket.on('file2_1_EventTrigged', function (data) {
  socket.emit('update1', "send_from_another_js_1(io) : "+ data);
  console.log("+++ function send_from_another_js_1(io) called");
  });
 });
}

function send_from_another_js_2(io){
  io.on('connection', function (socket) {
  socket.on('file2_2_EventTrigged', function (data) {
  socket.emit('update2', "send_from_another_js_2(io) : "+ data);
  console.log("... function send_from_another_js_2(io) called");
  });
 });
}

module.exports = {
 send_from_another_js_1,
 send_from_another_js_2
}

"index.html"

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="Content-Type" content="text/html">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta name="keywords" content="HTML, CSS, JavaScript">
 <meta name="author" content="Dr.Chaiya Tantisukarom">
 <meta http-equiv="Cache-Control" content="public, max-age=31536000">
 <title>NodeJS socket.io</title>
</head>
<body>
 <h1 style="text-align: center;">Hello another world</h1>
 <div style="text-align: center;">
  <span>
   <button onclick="file2_1()">file2_1</button>
  </span>
  <span>
   <button onclick="file2_2()">file2_2</button>
  </span>
 </div>

<script src="/socket.io/socket.io.js"></script>
<script>
 var socket = io();
 socket.on('connect',()=>{
  //alert('Connected');
 })

function file2_1(){
 socket.emit('file2_1_EventTrigged', "Hello file2_1, how are you today?");
}
socket.on('update1', (data)=>{
 alert(data);
})

function file2_2(){
 socket.emit('file2_2_EventTrigged', "Hi file2_2, trust you are ok.");
}
socket.on('update2', (data)=>{
 alert(data);
})

</script>
</body>
</html>

Cheers !!!

Answer 2

You need to wait for your server to get initialized. You are calling your function before socket.io is ready. That's why io.emit function is 'undefined'.

server.listen(8080,()=>{
  GOR.send_from_another_js(io);
})

Answer 3

When you call this:

server.listen(8080,()=>{
    console.log("server started");
    setInterval(GOR.send_from_another_js,5000);
    GOR.send_from_another_js(io);
})

setInterval() isn't providing a parameter for GOR.send_from_another_js() , so io becomes undefined.

To fix this, I would use a second lambda expression inside of your setInterval() call.

server.listen(8080, () => {
    console.log("server started");
    setInterval(() => {
        GOR.send_from_another_js(io);
    }, 5000);
    GOR.send_from_another_js(io);
});