如何使用socket.io在node.js服务器的客户端(web浏览器)中显示实时数据？

kyxcudwk 于 2021-07-13 发布在 Java

关注(0)|答案(1)|浏览(481)

我想在浏览器中显示实时语音到文本数据。我所说的实时是指，“当我说话的时候，我同时得到文本输出”。我已经使用google云服务api在python中实现了speech-to-text部分。然后我使用“子进程”在node.js环境中运行python程序。到现在为止一切都很好。接下来，我想在浏览器中显示实时文本。换句话说，我想将python（现在在node.js中使用子进程运行）的实时文本输出发送到web浏览器。我试着用socket.io来做这个。下面是我的服务器端（node.js）代码，其中还应用了socket.io：

const express = require('express');
//const router = express.Router();
const {spawn} = require('child_process');
const path = require('path');
const app = express();
const http = require('http');
const server = http.createServer(app);
//const server = http.createServer(app); 
const { Server } = require("socket.io");
const io = new Server(server);
function runScript(){
  return spawn('python3', [
          "-u",
    path.join(__dirname, 'script.py')
  ]);
}
const subprocess = runScript()
// print output of the script
app.get('/', (req,res) => {
        res.sendFile(__dirname + '/index.html');
});
io.on('connection', (socket) => {
subprocess.stdout.on('data', (data) => {
  //console.log(`data:${data}`);
        socket.on('message', (data) => {
                socket.broadcast.emit('message', data);
        });
});
});
server.listen(3000, () => {
  console.log('listening on *:3000');
});

上面，我首先使用子进程调用node.js中的python程序，然后使用socket.broadcast.emit将python程序的文本输出发送到客户端。客户端代码如下所示：

<!DOCTYPE html>
<html>
        <head>
        <script src="/socket.io/socket.io.js"></script>
        <script>
                var socket = io();
        var messages = document.getElementById('messages'); 
        //const EventEmitter = require('events');
        //const emitter = new EventEmitter()
        //emitter.setMaxListeners(50)
        socket.on('messages', function(data) {
                var item = document.createElement('p');
                item.textContent = data; 
                messages.appendChild(data); 
                window.scrollTo(0, document.body.scrollHeight);
        });
        </script>
        </head>
        <body>
                <h1> This is crazy </h1>
                <p id="messages"> </p>
        </body>
</html>

上面，我想在标记中显示python程序的实时文本输出。问题是，我无法在网络浏览器中获取任何内容。我的目标是，我想在网络浏览器中以文本的形式实时显示我所说的一切。
我对socket.io了解不多。事实上，这是我第一次使用这种技术。

python JavaScript node.js child-process socket.io

来源：https://stackoverflow.com/questions/67283553/how-to-use-socket-io-to-display-realtime-data-in-the-client-web-browser-from-t

1条答案

按热度按时间

alen0pnh1#

nodejs服务器将充当套接字服务器。如您的代码所示，它在端口上侦听套接字连接，在连接上创建一个套接字，然后您也可以发送消息。通过简单的粗略检查，服务器代码看起来还不错。
在您的网页上，您正在创建套接字并侦听消息。
然而，网页上运行的套接字还没有连接到服务器，这就是为什么还没有工作。
假设您在localhost上执行此操作，只需将socket服务器地址添加到其构造函数中，然后侦听connect。

const socket = io('ws://localhost:3000');
socket.on('connect', () => {
  // do any authentication or handshaking here.
  console.log('socket connected');
});

更高级的实现应该优雅地处理关闭的套接字。

赞(0）回复(0）举报 2021-07-13

我来回答

如何使用socket.io在node.js服务器的客户端(web浏览器)中显示实时数据？

1条答案

相关问题

热门标签

最新问答