将 mysql 数据库打印到 socket.io 和 node.js 中的 html 页面答案

【问题标题】：printing mysql database to a html page in socket.io and node.js将 mysql 数据库打印到 socket.io 和 node.js 中的 html 页面
【发布时间】：2026-02-08 00:10:01
【问题描述】：

我正在尝试能够将 mysql 数据打印到 html 页面只是为了测试它，以便我可以开始学习

更新代码

这是我在 server.js 上尝试过的

var mysql = require("mysql");
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

app.get('/', function(req, res){
  res.sendfile('testsql.html');
  //res.sendfile('/login/');
});
http.listen(3000, function(){
  console.log('listening on *:3000');
});
var con = mysql.createConnection({
    host: "localhost",
    user: "root",
    password: "password",
    database: "users"
});


io.on('connection', function (socket) {

    console.log('a client connected');

    con.query('SELECT * FROM users',function(err,rows){
      if(err) throw err;
      console.log('Data received from Db:\n');
      console.log(rows);
      socket.emit('showrows', rows);
    });



});

**这是我的客户代码**

<!doctype html>
<html>
  <head>
    <title>Testing socket.io</title>
  </head>
  <body>
    <h1 id="socketio"> not connected </h1>
    <div id="display"> </div>
    <script src="/socket.io/socket.io.js"></script>
    <script>
      var socket = io();
      socket.on('connect', function() {
        document.getElementById("socketio").innerHTML = "socket connected";
      });
      socket.on('showrows', function(dbData) {
        document.getElementById("display").innerHTML = dbData;
      });
    </script>
  </body>
</html>

客户端显示它正在连接到服务器，但它没有在客户端显示查询结果

【问题讨论】：

标签： html mysql node.js socket.io

【解决方案1】：

您可以尝试以下更改：

在服务器中：

var con = mysql.createConnection({
    host: "localhost",
    user: "root",
    password: "password",
    database: "users"
});


io.on('connection', function (socket) {

    console.log('a client connected');

    con.query('SELECT * FROM users',function(err,rows){
      if(err) throw err;
      console.log('Data received from Db:\n');
      console.log(rows);
      socket.emit('showrows', rows);
    });



 });

在客户端：

<!doctype html>
<html>
  <head>
    <title>Testing socket.io</title>
  </head>
  <body>
    <h1 id="socketio"> not connected </h1>
    <div id="display"> </div>
    <script src="/socket.io/socket.io.js"></script>
    <script>
      var socket = io();
      socket.on('connect', function() {
        document.getElementById("socketio").innerHTML = "socket connected";
      });
      socket.on('showrows', function(rows) {
        var html='';
        for (var i=0; i<rows.length; i++) {
          html += rows[i].firstname + ' ' + rows[i].lastname + '<br>';
        }  
        document.getElementById("display").innerHTML = html;
        console.log(rows);
      });
    </script>
  </body>
</html>

【讨论】：

这至少会在控制台中显示整个表格，而不是在客户端 html 页面上
我没有看到 jquery 和 socket.io 加载到您的客户端代码中
我编辑了我的答案，并在您的 client.html 中添加了一些行，以获得良好的开始
先生，感谢您为帮助我所做的所有辛勤工作，它表明客户端正在连接到服务器，并且每次我刷新它都会在控制台中显示数据库，而不是在客户端上 here如果您想亲自查看，是测试所在的页面
好的，让我们将服务器中的一行：socket.emit('showrows', dbData); 更改为以下内容：socket.emit('showrows', 'These are some rows:<br>first row<br>second row<br>third row');

【解决方案2】：

我看到以下错字：socket.brodcast.emit('showrows', rows); 应该是 socket.broadcast.emit('showrows', rows);

但在你的情况下，你只需要socket.emit('showrows', rows)。为了在客户端收听这个，你需要有这个：

socket.on('showrows', function(rows){
    console.log(rows);
    jQuery("#display").append(rows);
});

【讨论】：

【解决方案3】：

首先，您尝试创建与 mysql 服务器的连接两次。

而且我相信您的客户端错过了一些东西。您忘记连接到您的 socket.io 服务器。

var socket = io.connect('http://localhost:3000', {'reconnect': true, 'force new connection': true, 'connect timeout': 1000});

socket.on('showrows', function(rows) {
    jQuery("#display").append(rows);
});

在发出查询结果之前，您还应该确保您的客户端已连接到服务器。

io.sockets.on('connection', function (socket) {

   //Run your mysql query method

  //Socket disconnected
    socket.once('disconnect', function () {

    });
});

更新：只有在完成查询后才结束 mysql 连接。

con.connect(function(err){
  if(err){
    console.log('Error connecting to Db');
    return;
  }
  console.log('Connection established');
});

//Don't recreate a mysql connection


con.query('SELECT * FROM users',function(err,rows){
  if(err) throw err;

  console.log('Data received from Db:\n');
  console.log(rows);
});


con.end(function(err) {
  // The connection is terminated gracefully
  // Ensures all previously enqueued queries are still
  // before sending a COM_QUIT packet to the MySQL server.
});

【讨论】：

除了 it works 段落外，仍然没有任何显示
也许你可以尝试更新上面的代码，以便我们知道你做了什么。
@NicholasHendricks 我已经更新了我的代码。查看最后一部分。
我已经更新了我的代码，我的方向正确吗？
@NicholasHendricks 您需要在 html 代码中包含 jQuery 和 socket.io 客户端脚本。对于服务器端，您可以在任何客户端连接到服务器之前创建与 mysql 服务器的连接。您只需要查询是否有用户连接到您的服务器，并且只有在 mysql 查询返回结果时才向您的客户端发出。