window.onload 未在 NodeJS 页面中运行

Question

我正在使用 Express 和 Socket.io 制作 NodeJS 应用程序。我正在尝试以对象的形式从服务器向客户端发送一些数据，并且我希望在加载页面时发生这种情况。然后，可以使用接收到的对象更改一些 HTML。我很确定 Socket.io 可以做到这一点。但是，当使用window.onload = function() {...} 时，没有任何反应。 window.onload 甚至没有被调用。

当我在不使用 NodeJS（仅使用 HTML 页面）的情况下尝试此操作时，它可以正常工作。 window.onload 被调用，一切顺利。那么为什么这在 NodeJS 中不起作用呢？我知道它等待所有图像等加载并且有a problem with that，但现在大部分已经解决了。图片加载正常。 （我仍然无法使用background-image 加载它，这有什么不同吗？）

另外，我是否以正确的方式将数据从服务器发送到客户端？我宁愿使用 Socket.io，也不愿学习 Angular 或 React 之类的新东西。

这是我的代码：

ma​​in.js（客户端）

window.onload = function() {
  console.log('window loaded');   // this shows when not in NodeJS app
  alert('window ready');          // neither does this
  socket.emit('pageReady');       // so this doesn't run
}

socket.on('pageInfo', function(response) {
  console.log('page info received');    //this doesn't run either
  document.getElementById("schoolName").innerHTML = response.school_name;
});

app.js（服务器）

io.on('pageReady', function() {
  io.emit('pageInfo', response);       // response is defined earlier
  console.log('page ready recieved');  // this doesn't show
});

Answer 1

关于window.onload在你运行webserver时没有运行听起来很奇怪；你的实现看起来不错。会不会像您现在这样，您永远无法完成加载某些资产？

关于你对 socket.io 的实现：

您正在通过socket.emit() 向socket 发送事件，但您正在侦听发送到您的服务器而不是连接的套接字的事件。

尝试将您的事件绑定与服务器连接事件中，如下所示：

io.on("connection", (socket) => {

  socket.on('pageReady', function() {
    socket.emit('pageInfo', response);
    console.log('page ready recieved');
  });

}

关于本例使用socket.io

在这种情况下使用 socket.io 听起来有点过头了，您实际上是想调用服务器 (fetch()) 并获得包含要使用的数据的响应。 为此，我建议使用 fetch API 并将您的快速应用程序构建为更像 REST api：

服务器：

var app = Express();

app.get('/data', (request, response) => {
   response.send("hello");
}

客户：

fetch('/data')
  .then((data) => {
    console.log(data); // => hello
  });