Estos son mis objetivos.
.
const WebSocket = require('ws'); const url = 'wss://websocket.example'; const ws = new WebSocket(url); ws.onmessage = (event) => { wsMessages = JSON.parse(event.data); wsMessagesTime = wsMessages.t; wsMessagesData = wsMessages.d; console.log(wsMessagesTime, wsMessagesData); }; desde aquí puedo consolar. registrar wsMessagesTime y wsMessagesData durante cada evento y puedo ver la transmisión en vivo desde mi nodemon.
Ahora me gustaría enviar eso al elemento dom de mi navegador.
const {log, error } = console; const express = require('express'); const path = require('path'); const server = app.listen(3000, log('server is running on 3000')); app.use(express.static('./public')); app.get('/', (req,res) => { console.log('root page logged') }) desde aquí, coloco mi archivo index.html dentro del directorio ./public .
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>websocket testing</title> <script> var exports = {};</script> </head> <body> <h2>hi this is a test string</h2> <div id="websocket data"></div> </body> </html> A partir de aquí, quiero mostrar mis fuentes de datos de websocket en el elemento div con los websocket data .
Según mi investigación, Express es del lado del servidor, por lo que no tengo acceso al DOM, incluso los motores de visualización como ejs no me permiten ingresar datos en el DOM especificado. (corrígeme si me equivoco por favor)
Simplemente quiero mostrar la salida de console.log(wsMessagesTime, wsMessagesData); a la página web local que se ejecuta en el servidor express en el elemento div especificado como websocket data .