Pregunta de configuración simple aquí. Tengo mi proyecto de nodo que ha abierto un servidor localhost que ejecuta una página html. Desde esa página html, ¿cómo puedo llamar a otro script?
index.js
var http = require('http'); var fileSystem = require('fs'); var server = http.createServer(function(req, resp){ fileSystem.readFile('./main.html', function(error, fileContent){ if(error){ resp.writeHead(500, {'Content-Type': 'text/plain'}); resp.end('Error'); } else{ resp.writeHead(200, {'Content-Type': 'text/html'}); resp.write(fileContent); resp.end(); } }); }); server.listen(8080); console.log('Listening at: localhost:8080'); main.html
<!DOCTYPE html> <html lang="en"> <body> <p>Hello world! Node is awesome, is it not?</p> <script src="new_script.js"></script> </body> </html> Esta página muestra el texto <p> y se ejecuta en localhost: 8080, luego da el error en la consola Uncaught SyntaxError: Unexpected token '<'
Este es el new_script.js que no se está ejecutando:
alert("new_script.js called"); test1 = 123; test2 = 543; test3 = test1*test2; alert(test3);Y mi estructura de carpetas de archivos es plana, todo está ahí:
Entonces, ¿cómo puedo comenzar a llamar más JavaScript a mi página html cargada en mi servidor node.js?
Su sitio web actual en localhost:8080 no hará nada más que mostrar una página Html con el contenido de main.html, para todas las rutas de solicitud. Entonces, la llamada a localhost:8080/new_script.js, el archivo al que se hace referencia en su página principal, también devolverá el contenido de su main.html y no el contenido de ese archivo new_script.js. La primera aparición del carácter < en su main.html probablemente explica ese mensaje de error.
A menos que esté haciendo esto con fines puramente académicos, debería usar algo como Express si desea codificar un sitio web real.
Si realmente desea hacer esto con un nodo simple, debe analizar y manejar cada URL en el objeto de request . Tienes que hacer algo bastante laborioso como:
var server = http.createServer(function(req, resp){ if (req.url === "/") { fileSystem.readFile('./main.html', function(error, fileContent){ if(error){ resp.writeHead(500, {'Content-Type': 'text/plain'}); resp.end('Error'); } else{ resp.writeHead(200, {'Content-Type': 'text/html'}); resp.write(fileContent); resp.end(); } }); } else if (req.url === "/new_script.js") { fileSystem.readFile('./new_script.js', function(error, fileContent){ if(error){ resp.writeHead(500, {'Content-Type': 'text/plain'}); resp.end('Error'); } else{ resp.writeHead(200, {'Content-Type': 'text/javascript'}); resp.write(fileContent); resp.end(); } }); } else { resp.writeHead(404); resp.end("Not found"); } });(Solución publicada en nombre del autor de la pregunta, para moverla al espacio de respuesta) .
Esto se resolvió usando Express.js, que es realmente conveniente.
npm install express --saveíndice.js:
const express = require('express') const app = express() const port = 3000 app.use(express.static("./js")); app.get('/', (req, res) => { //res.send('Hello World!') res.sendFile('./main.html', { root: __dirname }); }) app.listen(port, () => { console.log(`Example app listening at http://localhost:${port}`) }) Ahora todo el código es el mismo, excepto que le digo al proyecto que use la carpeta "js/" para buscar archivos JavaScript. Así que moví new_script.js allí y funciona :)