html 中加入node.js,在Node.js中加载基本HTML

我刚刚找到了一种使用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);

});

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

您可以使用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);

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

const express = require('express');

const app = new express();

app.get('/', function(request, response){

response.sendfile('yourhtmlpagename.html');

});

就这么简单。

为此使用快递模块。

安装快递：npm install express -g

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

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

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

var http = require('http');

var fs = require('fs');

var path = require('path');

var ext = /[wd_-]+.[wd]+$/;

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

这是对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'));

});

使用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...');

我学到的最好的方法是使用快递和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");

干净，最好.. !!!

简单的方法是将所有文件(包括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实例，如果公共目录访问所有资源，我们正在给地址。

希望这可以帮助 ！

使用快递模块怎么样？

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

app.get('/',function(request,response){

response.sendFile(__dirname+'/XXX.html');

});

app.listen('8000');

然后，您可以使用浏览器获取/ localhost：8000

我认为这将是一个更好的选择，因为它显示运行服务器的URL：

var http = require('http'),

fs = require('fs');

const hostname = '';

const port = 3000;

const html=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(port, hostname, () => {

console.log(`Server running at http://${hostname}:${port}/`);

})

});

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

我知道这是一个老问题 - 如果您不想使用connect或express，这是一个简单的文件服务器实用程序;而是http模块。

var fileServer = require('./fileServer');

var http = require('http');

http.createServer(function(req, res) {

var file = __dirname + req.url;

if(req.url === '/') {

// serve index.html on root

file = __dirname + 'index.html'

}

// serve all other files echoed by index.html e.g. style.css

// callback is optional

fileServer(file, req, res, callback);

})

module.exports = function(file, req, res, callback) {

var fs = require('fs')

, ext = require('path').extname(file)

, type = ''

, fileExtensions = {

'html':'text/html',

'css':'text/css',

'js':'text/javascript',

'json':'application/json',

'png':'image/png',

'jpg':'image/jpg',

'wav':'audio/wav'

}

console.log('req '+req.url)

for(var i in fileExtensions) {

if(ext === i) {

type = fileExtensions[i]

break

}

}

fs.exists(file, function(exists) {

if(exists) {

res.writeHead(200, { 'Content-Type': type })

fs.createReadStream(file).pipe(res)

console.log('served '+req.url)

if(callback !== undefined) callback()

} else {

console.log(file,'file dne')

}

})

}

使用ejs而不是玉

npm install ejs

app.js

app.engine('html', require('ejs').renderFile);

app.set('view engine', 'html');

./routes/index.js

exports.index = function(req, res){

res.render('index', { title: 'ejs' });};

这是一个非常古老的问题......但如果您的用例是在临时的基础上将特定的HTML页面发送到浏览器，我会使用这样简单的东西：

var http = require('http')

, fs = require('fs');

var server = http.createServer(function(req, res){

var stream = fs.createReadStream('test.html');

stream.pipe(res);

});

server.listen(7000);

您还可以使用此代码段：

var app = require("express");

app.get('/', function(req,res){

res.sendFile(__dirname+'./dir/yourfile.html')

});

app.listen(3000);

我们可以加载带有连接框架工作的html文档。

我已将我的html文档和相关图像放在我项目的公共文件夹中，其中包含以下代码和节点模块。

//server.js

var http=require('http');

var connect=require('connect');

var app = connect()

.use(connect.logger('dev'))

.use(connect.static('public'))

.use(function(req, res){

res.end('hello worldn');

})

http.createServer(app).listen(3000);

我已经尝试了fs的readFile()方法，但它无法加载图像，这就是我使用connect框架的原因。

https://gist.github.com/xgqfrms-GitHub/7697d5975bdffe8d474ac19ef906e906

以下是使用Express服务器的主机静态HTML文件的简单演示代码！

希望它对你有所帮助！

// simple express server for HTML pages!

// ES6 style

const express = require('express');

const fs = require('fs');

const hostname = '127.0.0.1';

const port = 3000;

const app = express();

let cache = [];// Array is OK!

cache[0] = fs.readFileSync( __dirname + '/index.html');

cache[1] = fs.readFileSync( __dirname + '/views/testview.html');

app.get('/', (req, res) => {

res.setHeader('Content-Type', 'text/html');

res.send( cache[0] );

});

app.get('/test', (req, res) => {

res.setHeader('Content-Type', 'text/html');

res.send( cache[1] );

});

app.listen(port, () => {

console.log(`

Server is running at http://${hostname}:${port}/

Server hostname ${hostname} is listening on port ${port}!

`);

});