我想运行一个非常简单的HTTP服务器。对example.com的每个GET请求都应该得到index.html，但作为一个常规的HTML页面(即，与阅读普通网页时的体验相同)。
使用下面的代码，我可以读取index.html的内容。我如何服务index.html作为一个普通的网页?
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);
下面的一个建议很复杂，需要我为我想使用的每个资源(CSS、JavaScript、图像)文件写一个get行。
我如何能提供一个单一的HTML页面与一些图像，CSS和JavaScript?
当前回答
看看这个要点。我在这里复制它以供参考，但要点已定期更新。
Node.JS静态文件web服务器。将它放在您的路径中以启动任何目录中的服务器，需要一个可选的端口参数。
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");
更新
gist确实处理css和js文件。我自己也用过。在“二进制”模式下使用读/写不是问题。这仅仅意味着文件库不会将文件解释为文本，并且与响应中返回的内容类型无关。
你的代码的问题是你总是返回一个“文本/纯”的内容类型。上面的代码不返回任何内容类型，但如果您只是将其用于HTML、CSS和JS，浏览器可以很好地推断出这些内容。没有内容类型总比错误的内容类型好。
通常情况下，content-type是web服务器的配置。因此，如果这不能解决您的问题，我很抱歉，但是作为一个简单的开发服务器，它对我来说是有效的，我认为它可能对其他人有所帮助。如果确实需要响应中正确的内容类型，则需要像joeytwiddle那样显式地定义它们，或者使用像Connect这样具有合理默认值的库。这样做的好处是它简单且自包含(没有依赖)。
但我确实感觉到了你的问题。这就是组合解。
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");
其他回答
我在npm上发现了一个有趣的库，可能对你有用。它叫做mime(npm install mime或https://github.com/broofa/node-mime)，它可以确定文件的mime类型。下面是我用它写的一个web服务器的例子:
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")
这将服务于任何常规的文本或图像文件(.html， .css， .js， .pdf， .jpg， .png， .m4a和.mp3是我测试过的扩展名，但理论上它应该适用于所有文件)
开发人员指出
下面是我用它得到的输出示例:
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
注意路径构造中的unescape函数。这是为了允许包含空格和编码字符的文件名。
你可以在shell中输入这些
npx serve
回购:https://github.com/zeit/serve。
稍微啰嗦一点的表达式4。X版本，但它在最少的行数中提供目录列表、压缩、缓存和请求登录
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 !")
我使用下面的代码来启动一个简单的web服务器，如果Url中没有提到文件，它会渲染默认的html文件。
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);
它将呈现所有的js, css和图像文件，以及所有的html内容。
同意“没有内容类型比错误的内容类型更好”的说法
Local-web-server绝对值得一看!以下是自述的节选:
本地web服务器
一个精简的、模块化的web服务器，用于快速的全栈开发。
支持HTTP、HTTPS和HTTP2。 体积小，100%个性化。只加载和使用项目所需的行为。 附加一个自定义视图以个性化活动的可视化方式。 编程和命令行接口。
使用此工具:
构建任何类型的前端web应用程序(静态，动态，单页应用程序，渐进式web应用程序，React等)。 原型后端服务(REST API，微服务，websocket，服务器发送事件服务等)。 监控活动，分析性能，试验缓存策略等。
Local-web-server是一个lws发行版，它与一个有用的中间件“入门包”捆绑在一起。
剧情简介
这个包安装ws命令行工具(请参阅使用指南)。
静态网站
不带任何参数地运行ws将把当前目录作为一个静态网站托管。导航到服务器将呈现一个目录列表或您的index.html，如果该文件存在的话。
$ ws
Listening on http://mbp.local:8000, http://127.0.0.1:8000, http://192.168.0.100:8000
静态文件教程。
这个片段演示了静态托管和两个日志输出格式-开发和统计。
单页应用
为单页应用程序(一个带有客户端路由的应用程序，例如React或Angular应用程序)提供服务就像指定单页的名称一样简单:
$ ws --spa index.html
对于静态站点，对典型SPA路径(例如/user/1， /login)的请求将返回404 Not Found，因为该位置的文件不存在。然而，通过将index.html标记为SPA，你创建了以下规则:
如果一个静态文件被请求(例如/css/style.css)，那么服务它，如果没有(例如/login)，那么服务指定的SPA并处理路由客户端。
SPA教程。
URL重写和代理请求
另一个常见的用例是将某些请求转发到远程服务器。
下面的命令将博客帖子请求从任何以/posts/开头的路径代理到https://jsonplaceholder.typicode.com/posts/。例如，对/posts/1的请求将被代理到https://jsonplaceholder.typicode.com/posts/1。
$ ws --rewrite '/posts/(.*) -> https://jsonplaceholder.typicode.com/posts/$1'
重写教程。
这个片段演示了上面加上——static的用法。Extensions用于指定默认文件扩展名，——verbose用于监视活动。
HTTPS和HTTP2
对于HTTPS或HTTP2，分别传递——HTTPS或——HTTP2标志。请参阅wiki以获得进一步的配置选项和如何在浏览器中获得“绿色挂锁”的指南。
$ lws --http2
Listening at https://mba4.local:8000, https://127.0.0.1:8000, https://192.168.0.200:8000
