Debes crear un servidor que sea capaz de recibir solicitudes del cliente y enviar una respuesta, puedes hacerlo con 'http' que viene incorporado con NodeJS, pero lo mas sencillo es hacerlo con la libreria express. Tambien debes incorporar el middleware cors para permitir solicitudes desde dominios/puertos/protocolos diferentes a donde se ubica el servidor. Para instalar dichos modulos, en la terminal en el directorio donde este ubicada tu aplicación de Node:
npm i express
npm i cors
aquí un pequeño ejemplo de lo que podría ser tu servidor
const mysql = require('mysql')
const cors = require('cors')
const express = require('express')
const app = express() // creamos servidor de express
app.use(cors()) // usamos el middleware cors
app.get('/getproducts', (req, res) => { // controlador (el cliente debe hacer un fetch hacia esta ruta para obtener la respuesta)
let conexion = mysql.createConnection({
user: '***', // datos de conexion
host: '***',
password: '***',
database: '***'
})
conexion.connect();
conexion.query('SELECT * FROM Producto ORDER BY PRECIO DESC LIMIT 1', (err, results) => {
conexion.end()
if(err) res.status.send('Error en la querie')
res.status(200).send(results) // se envia la respuesta al cliente con el resultado de la querie
})
})
app.listen(3002) // puerto de escucha del servidor
luego del lado del cliente, supongamos que tienes el siguiente HTML:
<!DOCTYPE html>
<html lang="es">
<head>
<title>Prueba</title>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<div id="result_container">
<!-- aqui se insertara el resultado de la querie -->
</div>
<script src="scripts2.js" defer></script>
</body>
</html>
Puedes insertar los datos de la respuesta del servidor como html de la siguiente forma, usando un script:
scripts2.js:
const contenedor = document.getElementById('result_container');
fetch('http://localhost:3002/getproducts') // llamamos a la ruta del controlador
.then(res => res.json())
.then(res => {
Object.entries(res[0]).forEach(elem => { // insertamos los datos de la respuesta en el div 'contenedor'
contenedor.innerHTML += `<div><span>${elem[0]}:</span>${elem[1]}</div>`
})
})
Esto es muy general y a muy grandes rasgos, basicamente necesitas un servidor que reciba solicitudes del cliente, se pueda conectar a la base de datos para hacerle consultas y devolver los resultados de esa consulta como respuesta al cliente, luego este podrá renderizar HTML en combinación con los datos de la respuesta.
JS
es igual aJavaScript
lo que es diferente deJava
. Eso hace que se desvíe un poco la atención en tu pregunta. Yo por ejemplo, desconozcoJava
pero entré porque en el título decíaJS
. Te sugiero editarla y aclarar ese tema.html
que contenga los datos que has consultado. Puedes hacerlo usando el servidor incorporadohttp
o podrías usar alguna librería o framework que lo haga un poco más fácil, como por ejemploexpress
. En tu código no se ve nada parecido a un servidor web. Saludos