Pregunta Usando node.js como un simple servidor web


Quiero ejecutar un servidor HTTP muy simple. Cada solicitud GET a example.com debería obtener index.html se le sirvió pero como una página HTML normal (es decir, la misma experiencia que cuando lee páginas web normales).

Usando el siguiente código, puedo leer el contenido de index.html. Cómo sirvo index.html como una página web regular?

var http = require('http');
var fs = require('fs');
var index = fs.readFileSync('index.html');

http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end(index);
}).listen(9615);

Una sugerencia a continuación es complicada y requiere que escriba un get línea para cada archivo de recursos (CSS, JavaScript, imágenes) que quiero usar.

¿Cómo puedo servir una sola página HTML con algunas imágenes, CSS y JavaScript?


935
2018-05-21 20:44


origen


Respuestas:


Puedes usar Conectar y ServeStatic con Node.js para esto:

  1. Instalar connect y serve-static con NPM

    $ npm install connect serve-static
    
  2. Cree el archivo server.js con este contenido:

    var connect = require('connect');
    var serveStatic = require('serve-static');
    connect().use(serveStatic(__dirname)).listen(8080, function(){
        console.log('Server running on 8080...');
    });
    
  3. Ejecutar con Node.js

    $ node server.js
    

Ahora puede ir a http://localhost:8080/yourfile.html


859
2017-12-08 08:09



El servidor más simple de Node.js es simplemente:

$ npm install http-server -g

Ahora puede ejecutar un servidor a través de los siguientes comandos:

$ cd MyApp

$ http-server

Si está usando NPM 5.2.0 o posterior, puede usar http-server sin instalarlo con npx. No se recomienda su uso en producción, pero es una forma excelente de obtener rápidamente un servidor ejecutándose en localhost.

$ npx http-server

O bien, puede intentar esto, lo que abre su navegador web y habilita las solicitudes CORS:

$ http-server -o --cors

Para más opciones, revisa el documentación para http-server en GitHub, o corre:

$ http-server --help

Muchas otras características interesantes y una implementación sencilla para el cerebro en NodeJitsu.

Característica Forks

Por supuesto, puede completar fácilmente las funciones con su propio tenedor. Es posible que ya lo hayas hecho en una de las más de 800 horquillas existentes de este proyecto:

Light Server: una alternativa de actualización automática

Una buena alternativa para http-server es light-server. Es compatible con la visualización de archivos y la actualización automática y muchas otras funciones.

$ npm install -g light-server 
$ light-server

Agregar a su menú contextual de directorio en Windows Explorer

 reg.exe add HKCR\Directory\shell\LightServer\command /ve /t REG_EXPAND_SZ /f /d "\"C:\nodejs\light-server.cmd\" \"-s\" \"%V\""

Servidor JSON REST simple

Si necesita crear un servidor REST simple para un proyecto prototipo, entonces json-server podría ser lo que estás buscando.

Editores de actualización automática

La mayoría de los editores de páginas web y herramientas IDE ahora incluyen un servidor web que vigilará sus archivos fuente y actualizará automáticamente su página web cuando cambien.

los fuente abierta editor de texto Soportes también incluye un servidor web estático NodeJS. Simplemente abra cualquier archivo HTML entre corchetes, presione "Vista previa en vivo"y se inicia un servidor estático y se abre el navegador en la página. El navegador ** se actualizará automáticamente cada vez que edite y guarde el archivo HTML. Esto es especialmente útil cuando se prueban sitios web adaptables. Abra su página HTML en múltiples navegadores / tamaños de ventana / devices. Guarde su página HTML y vea al instante si su material adaptable está funcionando, ya que todas autorefrescar.

Desarrolladores PhoneGap

Si está codificando un aplicación móvil híbrida, puede interesarte saber que PhoneGapequipo tomó este concepto de actualización automática a bordo con su nuevo Aplicación PhoneGap. Esta es una aplicación móvil genérica que puede cargar los archivos HTML5 de un servidor durante el desarrollo. Este es un truco muy astuto ya que ahora puede omitir los pasos lentos de compilación / implementación en su ciclo de desarrollo para aplicaciones móviles híbridas si está cambiando archivos JS / CSS / HTML, que es lo que está haciendo la mayoría del tiempo. También proporcionan el servidor web NodeJS estático (ejecute phonegap serve) que detecta cambios de archivos.

Desarrolladores PhoneGap + Sencha Touch

Ahora he adaptado ampliamente el servidor estático PhoneGap y la aplicación para desarrolladores PhoneGap para los desarrolladores de Sencha Touch y jQuery Mobile. Compruébalo en Sencha Touch Live. Admite códigos QR QR y un túnel de localización que envía un servidor estático desde su computadora de escritorio a una URL fuera del firewall. Toneladas de usos. Masiva aceleración para desarrolladores móviles híbridos.

Desarrolladores de Cordova + Ionic Framework

El servidor local y las características de actualización automática se preparan en el ionic herramienta. Solo corre ionic serve desde su carpeta de aplicaciones. Aun mejor ... ionic serve --lab para ver la actualización automática de vistas paralelas de iOS y Android.


828
2018-04-17 01:21



Mira esto esencia. Lo estoy reproduciendo aquí para referencia, pero la esencia se ha actualizado regularmente.

Node.JS servidor de archivos estáticos web. Ponlo en tu camino para iniciar servidores en cualquier directorio, toma un argumento de puerto opcional.

var http = require("http"),
    url = require("url"),
    path = require("path"),
    fs = require("fs"),
    port = process.argv[2] || 8888;

http.createServer(function(request, response) {

  var uri = url.parse(request.url).pathname
    , filename = path.join(process.cwd(), uri);

  fs.exists(filename, function(exists) {
    if(!exists) {
      response.writeHead(404, {"Content-Type": "text/plain"});
      response.write("404 Not Found\n");
      response.end();
      return;
    }

    if (fs.statSync(filename).isDirectory()) filename += '/index.html';

    fs.readFile(filename, "binary", function(err, file) {
      if(err) {        
        response.writeHead(500, {"Content-Type": "text/plain"});
        response.write(err + "\n");
        response.end();
        return;
      }

      response.writeHead(200);
      response.write(file, "binary");
      response.end();
    });
  });
}).listen(parseInt(port, 10));

console.log("Static file server running at\n  => http://localhost:" + port + "/\nCTRL + C to shutdown");

Actualizar

Lo esencial maneja los archivos css y js. Lo he usado yo mismo. El uso de lectura / escritura en el modo "binario" no es un problema. Eso solo significa que el archivo no es interpretado como texto por la biblioteca de archivos y no está relacionado con el tipo de contenido que se devuelve en la respuesta.

El problema con su código es que siempre devuelve un tipo de contenido de "texto / normal". El código anterior no devuelve ningún tipo de contenido, pero si solo lo está utilizando para HTML, CSS y JS, un navegador puede inferir que está bien. Ningún tipo de contenido es mejor que uno incorrecto.

Normalmente, el tipo de contenido es una configuración de su servidor web. Entonces lo siento si esto no soluciona tu problema, pero funcionó para mí como un simple servidor de desarrollo y pensé que podría ayudar a otras personas. Si necesita tipos de contenido correctos en la respuesta, debe definirlos explícitamente como joeytwiddle o utilizar una biblioteca como Connect que tenga valores predeterminados razonables. Lo bueno de esto es que es simple y autónomo (sin dependencias).

Pero sí siento tu problema. Entonces aquí está la solución combinada.

var http = require("http"),
    url = require("url"),
    path = require("path"),
    fs = require("fs")
    port = process.argv[2] || 8888;

http.createServer(function(request, response) {

  var uri = url.parse(request.url).pathname
    , filename = path.join(process.cwd(), uri);

  var contentTypesByExtension = {
    '.html': "text/html",
    '.css':  "text/css",
    '.js':   "text/javascript"
  };

  fs.exists(filename, function(exists) {
    if(!exists) {
      response.writeHead(404, {"Content-Type": "text/plain"});
      response.write("404 Not Found\n");
      response.end();
      return;
    }

    if (fs.statSync(filename).isDirectory()) filename += '/index.html';

    fs.readFile(filename, "binary", function(err, file) {
      if(err) {        
        response.writeHead(500, {"Content-Type": "text/plain"});
        response.write(err + "\n");
        response.end();
        return;
      }

      var headers = {};
      var contentType = contentTypesByExtension[path.extname(filename)];
      if (contentType) headers["Content-Type"] = contentType;
      response.writeHead(200, headers);
      response.write(file, "binary");
      response.end();
    });
  });
}).listen(parseInt(port, 10));

console.log("Static file server running at\n  => http://localhost:" + port + "/\nCTRL + C to shutdown");

147
2017-11-29 21:46



No necesitas expresar. No necesitas conectarte Node.js hace http NATIVAMENTE. Todo lo que necesita hacer es devolver un archivo que depende de la solicitud:

var http = require('http')
var url = require('url')
var fs = require('fs')

http.createServer(function (request, response) {
    var requestUrl = url.parse(request.url)    
    response.writeHead(200)
    fs.createReadStream(requestUrl.pathname).pipe(response)  // do NOT use fs's sync methods ANYWHERE on production (e.g readFileSync) 
}).listen(9615)    

Un ejemplo más completo que garantiza que las solicitudes no puedan acceder a los archivos que se encuentran debajo de un directorio base y que maneje correctamente el error:

var http = require('http')
var url = require('url')
var fs = require('fs')
var path = require('path')
var baseDirectory = __dirname   // or whatever base directory you want

var port = 9615

http.createServer(function (request, response) {
    try {
        var requestUrl = url.parse(request.url)

        // need to use path.normalize so people can't access directories underneath baseDirectory
        var fsPath = baseDirectory+path.normalize(requestUrl.pathname)

        var fileStream = fs.createReadStream(fsPath)
        fileStream.pipe(response)
        fileStream.on('open', function() {
             response.writeHead(200)
        })
        fileStream.on('error',function(e) {
             response.writeHead(404)     // assume the file doesn't exist
             response.end()
        })
   } catch(e) {
        response.writeHead(500)
        response.end()     // end the response so browsers don't hang
        console.log(e.stack)
   }
}).listen(port)

console.log("listening on port "+port)

75
2017-10-14 06:59



Creo que la parte que te estás perdiendo ahora es que estás enviando:

Content-Type: text/plain

Si desea que un navegador web represente el código HTML, debe cambiarlo a:

Content-Type: text/html

64
2018-05-21 21:11



Paso 1 (dentro del símbolo del sistema [Espero que grabe en su carpeta]): npm install express

Paso 2: crea un archivo server.js

var fs = require("fs");
var host = "127.0.0.1";
var port = 1337;
var express = require("express");

var app = express();
app.use(express.static(__dirname + "/public")); //use static files in ROOT/public folder

app.get("/", function(request, response){ //root dir
    response.send("Hello!!");
});

app.listen(port, host);

Tenga en cuenta que debe agregar WATCHFILE (o use nodemon) también. El código anterior es solo para un servidor de conexión simple.

PASO 3: node server.js o nodemon server.js

Ahora hay un método más sencillo si solo desea un servidor HTTP simple. npm install -g http-server

y abre nuestro directorio y tipo http-server

https://www.npmjs.org/package/http-server


43
2018-02-24 14:44



La manera más rápida:

var express = require('express');
var app = express();
app.use('/', express.static(__dirname + '/../public')); // ← adjust
app.listen(3000, function() { console.log('listening'); });

A tu manera:

var http = require('http');
var fs = require('fs');

http.createServer(function (req, res) {
    console.dir(req.url);

    // will get you  '/' or 'index.html' or 'css/styles.css' ...
    // • you need to isolate extension
    // • have a small mimetype lookup array/object
    // • only there and then reading the file
    // •  delivering it after setting the right content type

    res.writeHead(200, {'Content-Type': 'text/html'});

    res.end('ok');
}).listen(3001);

27
2018-02-07 08:28