在Node.js中加载基本HTML

Question

这里只是一个简单的Node.js noob问题.我试图找出如何加载和"显示"一个基本的HTML文件,所以我不必编写像这样的代码__CODE__.

Answer 1

我刚刚找到了一种使用fs库的方法.我不确定它是否是最干净的.

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


fs.readFile('./index.html', function (err, html) {
    if (err) {
        throw err; 
    }       
    http.createServer(function(request, response) {  
        response.writeHeader(200, {"Content-Type": "text/html"});  
        response.write(html);  
        response.end();  
    }).listen(8000);
});

基本概念只是原始文件读取和转储内容.但仍然对更清洁的选择开放!

Answer 2

使用app.get获取html文件.这很简单!!

const express = require('express');
const app = new express();

app.get('/', function(request, response){
    response.sendFile('absolutePathToYour/htmlPage.html');
});

就这么简单.为此使用快递模块.安装快递:npm install express -g

Answer 3

您可以使用fs对象手动回显文件,但我建议使用ExpressJS框架让您的生活更轻松.

......但如果你坚持这么做的话:

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

http.createServer(function(req, res){
    fs.readFile('test.html',function (err, data){
        res.writeHead(200, {'Content-Type': 'text/html','Content-Length':data.length});
        res.write(data);
        res.end();
    });
}).listen(8000);

Answer 4

我知道这是一个老问题,但是没有人提到它,我认为值得添加:

如果你真的想要提供静态内容(例如'about'页面,图像,css等),你可以使用静态内容服务模块之一,例如node-static.(有其他人可能会更好/更糟糕 - 尝试search.npmjs.org.)随着预处理,然后你可以从静态过滤动态页面,并将它们发送到正确的请求处理程序一点点.

Answer 5

这可能是更好的一些,因为你将流式传输文件而不是像fs.readFile一样将它们全部加载到内存中.

var http = require('http');
var fs = require('fs');
var path = require('path');
var ext = /[\w\d_-]+\.[\w\d]+$/;

http.createServer(function(req, res){
    if (req.url === '/') {
        res.writeHead(200, {'Content-Type': 'text/html'});
        fs.createReadStream('index.html').pipe(res);
    } else if (ext.test(req.url)) {
        fs.exists(path.join(__dirname, req.url), function (exists) {
            if (exists) {
                res.writeHead(200, {'Content-Type': 'text/html'});
                fs.createReadStream('index.html').pipe(res);
            } else {
                res.writeHead(404, {'Content-Type': 'text/html'});
                fs.createReadStream('404.html').pipe(res);
        });
    } else {
        //  add a RESTful service
    }
}).listen(8000);

Answer 6

这是对Muhammed Neswine的回答的更新

在Express 4.x中,不推荐使用sendfile,必须使用sendFile函数.区别在于sendfile采用相对路径,sendFile采用绝对路径.因此,__ dirname用于避免硬编码路径.

var express = require('express');
var app = express();
var path = require("path");

app.get('/', function (req, res) {
    res.sendFile(path.join(__dirname + '/folder_name/filename.html'));
});

Answer 7

它使用pipe方法更灵活,更简单.

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

http.createServer(function(request, response) {
  response.writeHead(200, {'Content-Type': 'text/html'});

  var file = fs.createReadStream('index.html');
  file.pipe(response);

}).listen(8080);

console.log('listening on port 8080...');

Answer 8

我学到的最好的方法是使用快递和html文件作为快递提供了很多优势.如果你愿意,你也可以将它扩展到Heroku平台.只是说:)

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



console.log("Running at Port 3000");

干净,最好.. !!!

Answer 9

如果你使用管道，这真的很简单。以下是 server.js 代码片段。

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

function onRequest(req, res){

    console.log("USER MADE A REQUEST. " +req.url);
    res.writeHead(200, {'Content-Type': 'text/html'});
    var readStream = fs.createReadStream(__dirname + '/index.html','utf8'); 
    
/*include your html file and directory name instead of <<__dirname + '/index.html'>>*/

    readStream.pipe(res);

}

http.createServer(onRequest).listen(7000);
console.log('Web Server is running...');

Answer 10

简单的方法是将所有文件(包括index.html或所有资源,如CSS,JS等)放在公共文件夹中,或者您可以随意命名,现在您可以使用快速js并告诉应用程序使用_dirname作为:

在你的server.js中使用express添加这些

var express = require('express');
var app = express();
app.use(express.static(__dirname + '/public'));

如果你想让seprate目录在公共目录下添加新目录并使用该路径"/ public/YourDirName"

那么我们在这做什么呢？我们正在创建名为app的express实例,如果公共目录访问所有资源,我们正在给地址.希望这可以帮助 !

Answer 11

使用快递模块怎么样？

    var app = require('express')();

    app.get('/',function(request,response){
       response.sendFile(__dirname+'/XXX.html');
    });

    app.listen('8000');

然后,您可以使用浏览器获取/ localhost:8000

Answer 12

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

  http.createServer(function(request, response) {  
    response.writeHeader(200, {"Content-Type": "text/html"});  
    var readSream = fs.createReadStream('index.html','utf8')
    readSream.pipe(response);
  }).listen(3000);

 console.log("server is running on port number ");