Estoy tratando de enviar un objeto con datos de un servidor Node.js a un archivo js (para usar estos datos en la interfaz).
En el archivo main.js estoy manipulando el DOM. hago el siguiente pedido:
let dataName = []; let request = async ('http://localhost:3000/') => { const response = await fetch(url); const data = await response.json(); dataName = data.name; } let name = document.getElementById('name'); name.textContent = dataName;Luego, en el archivo server.js tengo un objeto:
data = [ { "id": 1, "name": "Jhon" }, { "id": 2, "name": "Mike" } ];Y me gustaría enviarlo como cadena json (u otra forma) a main.js como respuesta a mi solicitud.
Problema: Mis datos se muestran en la ventana del navegador. ¿Cómo podría obtenerlo como respuesta?
Lo intenté
let express = require('express'); let app = express(); app.use(express.static(`main`)); app.get('/', function(req, res){ res.json(data); //also tried to do it through .send, but there data only on window in browser }); app.listen(3000);¿Alguien podría decirme qué cambiar en mi código o indicarme la dirección en la que buscar en Google? (No quiero usar motores de plantillas).
Ayúdenme por favor :) La paz esté con ustedes.
Creo que está tratando de servir su interfaz y los datos JSON en la misma URL / .
Debe ajustar su código de servidor de la siguiente manera:
let express = require('express'); let app = express(); app.use(express.static(`main`)); app.get('/api', function(req, res){ res.json(data); //also tried to do it through .send, but there data only on window in browser }); app.listen(3000); Ahora sus datos estarán disponibles como JSON desde /api . Luego puede hacer una solicitud en la interfaz de la siguiente manera:
let dataName = []; let request = async () => { const response = await fetch('http://localhost:3000/api'); const data = await response.json(); dataName = data.name; } let name = document.getElementById('name'); name.textContent = dataName; También hubo un problema con la url que no se definía correctamente como argumento. Ajusté la función para simplemente usar la cadena de URL en el lugar correcto.
Puede crear un servidor que pueda comunicarse usando la API REST
(Suponiendo que los datos son una cadena)
cliente:
let data = getSomeDataYouWantToSend() fetch('/send', { method: 'POST', headers: { 'Content-Type': 'text/plain' }, body: data }) Suponiendo que tiene archivos estáticos en el directorio /main y archivos html en el directorio /views
servidor:
let express = require('express') let app = express() app.use(express.static(`${__dirname}/main`)) app.set('views', `${__dirname}/views`) app.get('/', (req, res) => { res.render('index.html') }) app.post('/send', (req, res) => { console.log(req.body) // <- here is your data sent from client frontend }) app.listen(3000)