Ik wil een heel eenvoudige HTTP-server gebruiken. Elk GET-verzoek aan example.comzou index.htmlmoeten krijgen, maar als een gewone HTML-pagina (dwz dezelfde ervaring als wanneer u normale webpagina’s leest).

Met de onderstaande code kan ik de inhoud van index.htmllezen. Hoe geef ik index.htmlweer als een gewone webpagina?

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);

Eén suggestie hieronder is ingewikkeld en vereist dat ik een regel getschrijf voor elk bronbestand (CSS, JavaScript, afbeeldingen) dat ik wil gebruiken.

Hoe kan ik een enkele HTML-pagina weergeven met enkele afbeeldingen, CSS en JavaScript?

Antwoord 1, autoriteit 100%

De eenvoudigste Node.js-server is gewoon:

$ npm install http-server -g

Nu kunt u een server uitvoeren via de volgende opdrachten:

$ cd MyApp
$ http-server

Als je NPM 5.2.0 of nieuwer gebruikt, kun je http-servergebruiken zonder het te installeren met npx. Dit wordt niet aanbevolen voor gebruik in productie, maar het is een geweldige manier om snel een server op localhost te laten draaien.

$ npx http-server

Of u kunt dit proberen, waardoor uw webbrowser wordt geopend en CORS-verzoeken worden ingeschakeld:

$ http-server -o --cors

Bekijk voor meer opties de documentatie voor http-serverop GitHub, of voer uit:

$ http-server --help

Veel andere leuke functies en hersendood-eenvoudige implementatie naar NodeJitsu.

Functievorken

Natuurlijk kun je de functies eenvoudig opwaarderen met je eigen fork. Misschien vindt u het al gedaan in een van de bestaande 800+ vorken van dit project:

https://github.com/nodeapps/http-server/network

Light Server: een automatisch vernieuwend alternatief

Een leuk alternatief voor http-serveris light-server. Het ondersteunt het bekijken en automatisch vernieuwen van bestanden en vele andere functies.

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

Toevoegen aan uw directory-contextmenu in Windows Verkenner

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

Eenvoudige JSON REST-server

Als u een eenvoudige REST-server voor een prototypeproject moet maken, kan json-serverzijn wat je zoekt.

Automatisch vernieuwende editors

De meeste webpagina-editors en IDE-tools bevatten nu een webserver die uw bronbestanden in de gaten houdt en uw webpagina automatisch ververst wanneer ze veranderen.

Ik gebruik Live Servermet Visual Studio Code.

De open sourceteksteditor Bracketsbevat ook een statische NodeJS-webserver. Open gewoon een HTML-bestand tussen haakjes, druk op “Live Preview” en het start een statische server en opent uw browser op de pagina. De browser zal automatisch vernieuwenwanneer u het HTML-bestand bewerkt en opslaat. Dit is vooral handig bij het testen van adaptieve websites. Open uw HTML-pagina in meerdere browsers/vensterformaten/apparaten. Sla je HTML-pagina op en kijk direct of je adaptieve dingen werken, aangezien ze allemaalautomatisch vernieuwen.

Web / SPA / PWA / Mobiel / Desktop / Browser Ext webontwikkelaars

Sommige SPA-frameworks bevatten een ingebouwde versie van de Webpack DevServerdie kan detecteren bronbestand wijzigen en een incrementele rebuild en patch (hot reloading genoemd) van uw SPA- of PWA-webapp activeren. Hier zijn een paar populaire SPA-frameworks die dit kunnen.

VueJS-ontwikkelaars

Voor VueJS-ontwikkelaars is een favoriet Quasar Frameworkdat de Webpack DevServer out-of-the-box bevat met switches om de server te ondersteunen -side rendering (SSR) en proxyregelsom uw CORS-problemen op te lossen. Het bevat een groot aantal geoptimaliseerde componenten die zijn ontworpen om zich aan te passen aan zowel mobiel als desktop. Hiermee kunt u één appbouwen voor ALLE platforms (SPA, SPA+SSR, PWA, PWA+SSR, Cordova en Capacitor Mobile AppStore-apps, Electron Desktop Node+VueJS-apps en zelfs browserextensies).

Een andere populaire is NuxtJSdie ook statische HTML/CSS-codegeneratie ondersteunt, evenals SSR of no-SSR build modi met plug-ins voor andere UI-componentsuites.

React Framework-ontwikkelaars

ReactJS-ontwikkelaars kunnen ook snel herladen instellen.

Cordova/Capacitor + Ionic Framework-ontwikkelaars

Iconic is een alleen mobielhybride componentenframework dat nu VueJS-, React- en Angular-ontwikkeling ondersteunt. Een lokale server met automatische vernieuwingsfuncties is ingebouwd in de ionic-tool. Voer gewoon ionic serveuit vanuit uw app-map. Nog beter … ionic serve --labom automatisch te bekijken -verfrissende zij aan zij weergaven van zowel iOS als Android.

Antwoord 2, autoriteit 94%

Opmerking: dit antwoord stamt uit 2011. Het is echter nog steeds geldig.

U kunt Connecten ServeStaticmet Node.js hiervoor:

Installeer connect and serve-static met NPM
```
$ npm install connect serve-static
```

Maak een server.js-bestand met deze inhoud:

var connect = require('connect');
 var serveStatic = require('serve-static');
 connect()
     .use(serveStatic(__dirname))
     .listen(8080, () => console.log('Server running on 8080...'));

Uitvoeren met Node.js
```
$ node server.js
```

Je kunt nu naar http://localhost:8080/yourfile.html

gaan

Antwoord 3, autoriteit 16%

Bekijk deze gist. Ik reproduceer het hier ter referentie, maar de essentie is regelmatig bijgewerkt.

Node.JS webserver met statisch bestand. Zet het in je pad om servers in elke map op te starten, neem een optioneel poortargument.

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");

update

De GIST behandelt CSS- en JS-bestanden. Ik heb het zelf gebruikt. Het gebruik van lezen / schrijven in “Binaire” -modus is geen probleem. Dat betekent alleen dat het bestand niet wordt geïnterpreteerd als tekst door de bestandsbibliotheek en niet gerelateerd is aan inhoud-type geretourneerd in het antwoord.

Het probleem met uw code wordt u altijd een inhoudstype “tekst / vlakte” retourneren. De bovenstaande code retourneert geen inhoudstype, maar als u het gewoon gebruikt voor HTML, CSS en JS, kan een browser die prima afleiden. Geen content-type is beter dan een verkeerde.

Normaal gesproken is het inhoudstype een configuratie van uw webserver. Dus het spijt me als dit niet oplost uw -probleem, maar het werkte voor mij als een eenvoudige ontwikkelingsserver en dacht dat het enkele andere mensen zou kunnen helpen. Als u behoefte heeft aan de juiste inhoudstypes in het antwoord, moet u deze expliciet definiëren als JoeyTWidddle heeft of gebruik een bibliotheek zoals Connect die verstandige standaardinstellingen heeft. Het leuke hierover is dat het eenvoudig en op zichzelf staan (geen afhankelijkheden).

Maar ik voel je probleem. Dus hier is de gecombineerde oplossing.

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");

Antwoord 4, autoriteit 10%

Je hebt geen express nodig. Je hebt geen verbinding nodig. Node.js doet http NATIVELY. Het enige wat u hoeft te doen is een bestand terug te sturen, afhankelijk van het verzoek:

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)

Een vollediger voorbeeld dat ervoor zorgt dat verzoeken geen toegang hebben tot bestanden onder een basismap, en dat de fout correct afhandelt:

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)

Antwoord 5, autoriteit 7%

Ik denk dat het deel dat je op dit moment mist, is dat je het volgende verzendt:

Content-Type: text/plain

Als u wilt dat een webbrowser de HTML weergeeft, moet u dit wijzigen in:

Content-Type: text/html

Antwoord 6, autoriteit 4%

Stap1 (in opdrachtprompt [ik hoop dat je cd NAAR JE MAP]) : npm install express

Stap 2: Maak een bestandsserver.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);

Let op, u moet ook WATCHFILE toevoegen (of nodemon gebruiken). Bovenstaande code is alleen voor een eenvoudige verbindingsserver.

STAP 3: node server.jsof nodemon server.js

Er is nu een eenvoudigere methode als u alleen een eenvoudige HTTP-server wilt hosten.
npm install -g http-server

en open onze directory en typ http-server

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

Antwoord 7, autoriteit 3%

De snelle manier:

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

Op jouw manier:

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);

Antwoord 8, autoriteit 2%

In plaats van een switch-instructie af te handelen, denk ik dat het netter is om het inhoudstype op te zoeken in een woordenboek:

var contentTypesByExtension = {
    'html': "text/html",
    'js':   "text/javascript"
};
...
    var contentType = contentTypesByExtension[fileExtension] || 'text/plain';

Antwoord 9

Dit is in feite een bijgewerkte versie van het geaccepteerde antwoord voor connect-versie 3:

var connect = require('connect');
var serveStatic = require('serve-static');
var app = connect();
app.use(serveStatic(__dirname, {'index': ['index.html']}));
app.listen(3000);

Ik heb ook een standaardoptie toegevoegd zodat index.html als standaard wordt weergegeven.

Antwoord 10

U hoeft geen NPM-modules te gebruiken om een eenvoudige server te draaien, er is een zeer kleine bibliotheek genaamd “NPM Free Server” voor Node:

NPM gratis server op GitHub

50 regels code, output als je een bestand of een map opvraagt en geeft het een rode of groene kleur als het niet werkte. Minder dan 1 KB groot (verkleind).

Antwoord 11

als je node op je pc hebt geïnstalleerd, heb je waarschijnlijk de NPM, als je geen NodeJS-dingen nodig hebt, kun je de dienenpakket hiervoor:

1 – Installeer het pakket op uw pc:

npm install -g serve

2 – Serveer uw statische map:

serve <path> 
d:> serve d:\StaticSite

Het laat zien welke poort uw statische map wordt geserveerd, navigeer gewoon naar de host zoals:

http://localhost:3000

Antwoord 12

U kunt alleen die in uw shell typen

npx serve

repo: https://github.com/zeit/serve .

Antwoord 13

Ik vond een interessante bibliotheek op NPM die vanzelf kan zijn. Het wordt MIME (npm install mimeof https://github.com/broofa/nod-mime) en het kan het MIME-type van een bestand bepalen. Hier is een voorbeeld van een webserver die ik heb geschreven met behulp van het:

var mime = require("mime"),http = require("http"),fs = require("fs");
http.createServer(function (req, resp) {
path  = unescape(__dirname + req.url)
var code = 200
 if(fs.existsSync(path)) {
    if(fs.lstatSync(path).isDirectory()) {
        if(fs.existsSync(path+"index.html")) {
        path += "index.html"
        } else {
            code = 403
            resp.writeHead(code, {"Content-Type": "text/plain"});
            resp.end(code+" "+http.STATUS_CODES[code]+" "+req.url);
        }
    }
    resp.writeHead(code, {"Content-Type": mime.lookup(path)})
    fs.readFile(path, function (e, r) {
    resp.end(r);
})
} else {
    code = 404
    resp.writeHead(code, {"Content-Type":"text/plain"});
    resp.end(code+" "+http.STATUS_CODES[code]+" "+req.url);
}
console.log("GET "+code+" "+http.STATUS_CODES[code]+" "+req.url)
}).listen(9000,"localhost");
console.log("Listening at http://localhost:9000")

Hierdoor dienen elk gewone tekst- of beeldbestand (.html, .css, .js, .pdf, .jpg, .png, .m4a en .mp3 zijn de extensies die ik heb getest, maar het zou het moeten werken voor alles)

Ontwikkelaar opmerkingen

Hier is een voorbeeld van de uitvoer die ik erbij heb gekregen:

Listening at http://localhost:9000
GET 200 OK /cloud
GET 404 Not Found /cloud/favicon.ico
GET 200 OK /cloud/icon.png
GET 200 OK /
GET 200 OK /501.png
GET 200 OK /cloud/manifest.json
GET 200 OK /config.log
GET 200 OK /export1.png
GET 200 OK /Chrome3DGlasses.pdf
GET 200 OK /cloud
GET 200 OK /-1
GET 200 OK /Delta-Vs_for_inner_Solar_System.svg

Let op de unescapeFunctie in de padconstructie. Dit is om bestandsnamen toe te staan met spaties en gecodeerde tekens.

Antwoord 14

EDIT:

Node.js Sample App Node chat heeft de gewenste functionaliteit.
In het is leesme.textfile
3. Stap is waar u naar op zoek bent.

Stap1

Maak een server die reageert op Hallo World op Port 8002

STAP2

Maak een index.html en serveer het

Stap3

introduceer util.js

Wijzig de logica zodat elk statisch bestand wordt geserveerd

Toon 404 in het geval dat er geen bestand wordt gevonden

STAP4

voeg jQuery-1.4.2.js

toe

voeg client.js

toe

Wijzig index.html om de gebruiker voor bijnaam

te vragen

Hier is de server.js

Hier is de util.js

Antwoord 15

De manier waarop ik het doe is om allereerst de statische node-server globaal te installeren via

npm install node-static -g

navigeer vervolgens naar de map die uw html-bestanden bevat en start de statische server met static.

Ga naar de browser en typ localhost:8080/"yourHtmlFile".

Antwoord 16

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/html'});
    // change the to 'text/plain' to 'text/html' it will work as your index page
    res.end(index);
}).listen(9615);

Ik denk dat je hier naar op zoek was. In je index.html, vul het gewoon met normale html-code – wat je er ook op wilt weergeven, zoals:

<html>
    <h1>Hello world</h1>
</html>

Antwoord 17

In principe het geaccepteerde antwoord kopiëren, maar geen js-bestand maken.

$ node
> var connect = require('connect'); connect().use(static('.')).listen(8000);

Vind het erg handig.

Bijwerken

Vanaf de nieuwste versie van Express is serve-static een aparte middleware geworden. Gebruik dit om te serveren:

require('http').createServer(require('serve-static')('.')).listen(3000)

Installeer eerst serve-static.

Antwoord 18

Ik gebruik onderstaande code om een eenvoudige webserver te starten die het standaard html-bestand weergeeft als er geen bestand in de URL wordt vermeld.

var http = require('http'),
fs = require('fs'),
url = require('url'),
rootFolder = '/views/',
defaultFileName = '/views/5 Tips on improving Programming Logic   Geek Files.htm';
http.createServer(function(req, res){
    var fileName = url.parse(req.url).pathname;
    // If no file name in Url, use default file name
    fileName = (fileName == "/") ? defaultFileName : rootFolder + fileName;
    fs.readFile(__dirname + decodeURIComponent(fileName), 'binary',function(err, content){
        if (content != null && content != '' ){
            res.writeHead(200,{'Content-Length':content.length});
            res.write(content);
        }
        res.end();
    });
}).listen(8800);

Het zal alle js-, css- en afbeeldingsbestanden weergeven, samen met alle html-inhoud.

Akkoord over stelling “Geen inhoudstype is beter dan een verkeerde“

Antwoord 19

van w3schools

het is vrij eenvoudig om een node-server te maken om elk gevraagd bestand te bedienen, en je hoeft er geen pakketten voor te installeren

var http = require('http');
var url = require('url');
var fs = require('fs');
http.createServer(function (req, res) {
  var q = url.parse(req.url, true);
  var filename = "." + q.pathname;
  fs.readFile(filename, function(err, data) {
    if (err) {
      res.writeHead(404, {'Content-Type': 'text/html'});
      return res.end("404 Not Found");
    }  
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.write(data);
    return res.end();
  });
}).listen(8080);

http: // localhost: 8080 / bestand.html

Serveer bestand.html van schijf

Antwoord 20

Ik weet niet zeker of dit precies is wat u wilde, maar u kunt proberen te wijzigen:

{'Content-Type': 'text/plain'}

Hieraan:

{'Content-Type': 'text/html'}

Hierdoor wordt de browserclient het bestand weergegeven als HTML in plaats van gewone tekst.

Antwoord 21

Express-functie Sendfile doet precies wat u nodig heeft, en aangezien u Web Server-functionaliteit van knooppunt wilt, komt Express als natuurlijke keuze en wordt vervolgens het dienen van statische bestanden zo eenvoudig als:

res.sendFile('/path_to_your/index.html')

Lees hier meer: https://expressjs.com/en/api.html # res.Sendfile

Een klein voorbeeld met Express-webserver voor knooppunt:

var express = require('express');
var app = express();
var path = require('path');
app.get('/', function(req, res) {
    res.sendFile(path.join(__dirname + '/index.html'));
});
app.listen(8080);

Voer dit uit en navigeer naar http: // localhost: 8080

Om hiermee uit te breiden om statisch bestanden als CSS en afbeeldingen te serveren, hier is een ander voorbeeld:

var express = require('express');
var app = express();
var path = require('path');
app.use(express.static(__dirname + '/css'));
app.get('/', function(req, res) {
    res.sendFile(path.join(__dirname + '/index.html'));
});
app.listen(8080);

Maak dus een submap met de naam CSS, plaats uw statische inhoud erin, en het is beschikbaar voor uw index.html voor eenvoudige referentie zoals:

<link type="text/css" rel="stylesheet" href="/css/style.css" />

Mededeling relatieve pad in HREF!

Voila!

Antwoord 22

var http = require('http');
var fs = require('fs');
var index = fs.readFileSync('index.html');
http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'html'});
res.end(index);
}).listen(9615);
//Just Change The CONTENT TYPE to 'html'

Antwoord 23

Een iets meer uitgebreide express 4.x-versie, maar dat biedt directory-lijst, compressie, caching en aanvragen inloggen in een minimaal aantal lijnen

var express = require('express');
var compress = require('compression');
var directory = require('serve-index');
var morgan = require('morgan'); //logging for express
var app = express();
var oneDay = 86400000;
app.use(compress());
app.use(morgan());
app.use(express.static('filesdir', { maxAge: oneDay }));
app.use(directory('filesdir', {'icons': true}))
app.listen(process.env.PORT || 8000);
console.log("Ready To serve files !")

Antwoord 24

Een gekke hoeveelheid ingewikkelde antwoorden hier. Als u niet van plan bent NODEJS-bestanden / database te verwerken, maar gewoon Statische HTML / CSS / JS / -afbeeldingen wilt bedienen, omdat uw vraag suggereert, installeer dan eenvoudig de PushState-server module of soortgelijk;

Hier is een “One Liner” die een mini-site maakt en lanceert. Plak eenvoudig dat hele blok in uw terminal in de juiste map.

mkdir mysite; \
cd mysite; \
npm install pushstate-server --save; \
mkdir app; \
touch app/index.html; \
echo '<h1>Hello World</h1>' > app/index.html; \
touch server.js; \
echo "var server = require('pushstate-server');server.start({ port: 3000, directory: './app' });" > server.js; \
node server.js

Open browser en ga naar http: // localhost: 3000 . Gedaan.

De server gebruikt de appdir als de root om bestanden van te bedienen. Om extra activa toe te voegen, plaats ze dan gewoon in die map.

Antwoord 25

Er zijn al enkele geweldige oplossingen voor een eenvoudige nodejs server.
Er is nog een oplossing als u live-reloadingnodig heeft zoals u wijzigingen in uw bestanden hebt aangebracht.

npm install lite-server -g

Navigeer uw map en doe

lite-server

Het zal de browser voor u openen met live-herladen.

Antwoord 26

De meeste van de bovenstaande antwoorden beschrijven heel mooi hoe de inhoud wordt weergegeven. Wat ik als extra zag, was een lijst van de map, zodat andere inhoud van de map kan worden doorzocht. Hier is mijn oplossing voor verdere lezers:

'use strict';
var finalhandler = require('finalhandler');
var http = require('http');
var serveIndex = require('serve-index');
var serveStatic = require('serve-static');
var appRootDir = require('app-root-dir').get();
var log = require(appRootDir + '/log/bunyan.js');
var PORT = process.env.port || 8097;
// Serve directory indexes for reports folder (with icons)
var index = serveIndex('reports/', {'icons': true});
// Serve up files under the folder
var serve = serveStatic('reports/');
// Create server
var server = http.createServer(function onRequest(req, res){
    var done = finalhandler(req, res);
    serve(req, res, function onNext(err) {
    if (err)
        return done(err);
    index(req, res, done);
    })
});
server.listen(PORT, log.info('Server listening on: ', PORT));

Antwoord 27

De eenvoudigere versie die ik ben tegengekomen is als volgt. Voor educatieve doeleinden is het het beste, omdat het geen abstracte bibliotheken gebruikt.

var http = require('http'),
url = require('url'),
path = require('path'),
fs = require('fs');
var mimeTypes = {
  "html": "text/html",
  "mp3":"audio/mpeg",
  "mp4":"video/mp4",
  "jpeg": "image/jpeg",
  "jpg": "image/jpeg",
  "png": "image/png",
  "js": "text/javascript",
  "css": "text/css"};
http.createServer(function(req, res) {
    var uri = url.parse(req.url).pathname;
    var filename = path.join(process.cwd(), uri);
    fs.exists(filename, function(exists) {
        if(!exists) {
            console.log("not exists: " + filename);
            res.writeHead(200, {'Content-Type': 'text/plain'});
            res.write('404 Not Found\n');
            res.end();
            return;
        }
        var mimeType = mimeTypes[path.extname(filename).split(".")[1]];
        res.writeHead(200, {'Content-Type':mimeType});
        var fileStream = fs.createReadStream(filename);
        fileStream.pipe(res);
    }); //end path.exists
}).listen(1337);

Ga nu naar de browser en open het volgende:

http://127.0.0.1/image.jpg

Hier moet image.jpgin dezelfde map staan als dit bestand.
Ik hoop dat dit iemand helpt 🙂

Antwoord 28

local-web-serveris zeker een kijkje waard! Hier is een fragment uit de readme:

lokale-webserver

Een slanke, modulaire webserver voor snelle full-stack ontwikkeling.

Ondersteunt HTTP, HTTPS en HTTP2.
Klein en 100% personaliseerbaar. Laad en gebruik alleen het gedrag dat vereist is voor uw project.
Voeg een aangepaste weergave toe om te personaliseren hoe activiteit wordt gevisualiseerd.
Programmatische en opdrachtregelinterfaces.

Gebruik deze tool om:

Bouw elk type front-end webapplicatie (statisch, dynamisch, Single Page App, Progressive Web App, React etc).
Prototype van een back-endservice (REST API, microservice, websocket, Server Sent Events-service, enz.).
Bewaak activiteit, analyseer prestaties, experimenteer met caching-strategie enz.

Local-web-server is een distributie van lwsgebundeld met een “startpakket” met nuttige middleware.

Samenvatting

Dit pakket installeert de wscommand-line tool (neem een kijkje op de gebruik ).

Static web site

Running wszonder argumenten wordt de huidige directory als een statische website te hosten. Navigeren naar de server zal een directory maken notering of je index.html, als dat bestand bestaat.

$ ws
Listening on http://mbp.local:8000, http://127.0.0.1:8000, http://192.168.0.100:8000

statische bestanden les .

Deze clip toont statische hosting plus een paar log output formaten -. deven stats

Eén pagina Application

Het dienen van een één pagina Application (een app met client-side routing, bijvoorbeeld een Reageer of Angular app) is zo triviaal als het opgeven van de naam van één pagina:

$ ws --spa index.html

Met een statische site, verzoeken voor typische SPA paden (bijvoorbeeld /user/1, /login) zou terugkeren 404 Not Foundals een bestand op die locatie niet bestaat. Echter, door het markeren van index.htmlals SPA u deze regel te maken:

Als een statisch bestand wordt gevraagd (bijvoorbeeld /css/style.css) dan dienen het, zo niet (bijvoorbeeld /login) dan dienen de gespecificeerde SPA en omgaan met de route client-side.

SPA handleiding .

URL-herschrijven en proxied-aanvragen

Een andere gemeenschappelijke gebruikscase is om bepaalde verzoeken naar een externe server te doorsturen.

De volgende opdracht Proxies Blog Postverzoeken van elk pad vanaf elk pad dat begint met /posts/NAAR https://jsonplaceholder.typicode.com/posts/. Bijvoorbeeld een aanvraag voor /posts/1zou benoemd tot https://jsonplaceholder.typicode.com/posts/1.

$ ws --rewrite '/posts/(.*) -> https://jsonplaceholder.typicode.com/posts/$1'

Herschrijf de tutorial .

Deze clip demonstreert het bovenstaande plus-gebruik van --static.extensionsom een standaardbestandverlenging en --verboseop te geven om de activiteit te volgen.

HTTPS EN HTTP2

Voor HTTPS of HTTP2, passeer de --httpsof --http2vlaggen. Zie de wiki voor verdere configuratie-opties en een gids over hoe u de ” Groen hangslot “in uw browser.

$ lws --http2
Listening at https://mba4.local:8000, https://127.0.0.1:8000, https://192.168.0.200:8000

Antwoord 29

Node.js Webserver vanaf nul

frameworks van 3e partijen; Maakt het querystring toe; Voegt trailing slash toe; Handgrepen 404

Maak een public_htmlsubmap en plaats al uw inhoud erin.

Samenvatting:https://gist.github.com/veganaize/ fc3b9aa393ca688a284c54caf43a3fc3

var fs = require('fs');
require('http').createServer(function(request, response) {
  var path = 'public_html'+ request.url.slice(0,
      (request.url.indexOf('?')+1 || request.url.length+1) - 1);
  fs.stat(path, function(bad_path, path_stat) {
    if (bad_path) respond(404);
    else if (path_stat.isDirectory() && path.slice(-1) !== '/') {
      response.setHeader('Location', path.slice(11)+'/');
      respond(301);
    } else fs.readFile(path.slice(-1)==='/' ? path+'index.html' : path,
          function(bad_file, file_content) {
      if (bad_file) respond(404);
      else respond(200, file_content);
    });
  });
  function respond(status, content) {
    response.statusCode = status;
    response.end(content);
  }
}).listen(80, function(){console.log('Server running on port 80...')});

Antwoord 30

Dit is een van de snelste oplossingen die ik gebruik om snel webpagina’s te bekijken

sudo npm install ripple-emulator -g

Vanaf dat moment hoeft u alleen maar de directory van uw html-bestanden in te voeren en uit te voeren

ripple emulate

wijzig vervolgens het apparaat naar Nexus 7 liggend.

Node.js gebruiken als een eenvoudige webserver