NodeJS socket.io实时显示MySQL中的数据

Question

我正在研究NodeJS和socket.io。

当前的功能可以很好地将mysql数据库中的数据显示到表中
现在，如果收到新数据，我需要页面视图自动更新/刷新(实时(。

这是HTML

<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].product_name + ' ' + rows[i].product_price + '<br>';
}  
document.getElementById("display").innerHTML = html;
console.log(rows);
});
</script>

和index.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: "",
database: "crud_db"
});
io.on('connection', function (socket) {
console.log('a client connected');
con.query('SELECT * FROM product',function(err,rows){
if(err) throw err;
console.log('Data received from Db:n');
console.log(rows);
socket.emit('showrows', rows);
});
});

我的问题是，如果收到新的数据，如何对网页进行实时功能？

Answer 1

我以前从未尝试过，但我认为你可以做这样的

1.当有新提交的数据时，首先监听事件

io.on('connection', function (socket) {
socket.on('new data', function (data) {
socket.emit('broadcast', data) // send it to the client
})
})

2.将io实例存储到app.locals:

app.locals.io = io

3.然后，考虑您有一个端点来创建一个新数据：

app.post('/product', function (req, res) {
const sql = `INSERT INTO products (name, price) VALUES (${req.body.name}, 
${req.body.price})`

con.query(sql, function (err, result) {
if (err) throw err;
const io = req.app.locals.io
io.emit('new data', { data: result })
})
})