接上一篇文章，这次的需求是给网站一个首页。
项目结构：
--- server.js
--- views
|--- index.html
我知道有时大家会把index放外面，但是为了说文件路径，我就把它放在views里面了。
相对于上回，多了几件事：
- 判断请求的是不是主页的地址；
- 收到请求后，要找到对应的文件，读出来；
- 将读出的文件内容打上响应头，标注上状态、格式等等，发回去。
Node
先解决读取首页的问题：
// fs是node中读写文件的模块。是的，服务器中终于没有读写本地文件的限制了～
let fs = require('fs')
http.createServer(function(request, response) {
// 新增的重点代码：
// 找到并读取这个文件
fs.readFile('views/index.html', function(err, data) {
// 先返回文件的属性（响应头）
response.writeHead(200, { 'Content-Type': 'text/html', 'Content-Length': data.length });
// 返回这个文件
response.write(data);
// 记得结束这次响应
response.end();
});
// 结束
}).listen(port);
再来看路由的问题：
上面的代码现在还有一个问题：无论如何访问这个服务器，目前都只能返回这个页面。但是我只希望访问域名时才显示首页，其他地址要留出来。
- 先看看请求的相关属性：
http.createServer(function(request, response) {
// 有机会也可以直接把request打印出来看看，内容超级多～
console.log(request.method)
console.log(request.url)
})
访问一下服务器，看到控制台输出的是：
GET
/
GET
/favicon.ico
这表示服务器先接到了一个访问'/'的GET请求，又接到了一个访问'/favicon.ico'的GET请求。后面这个是默认访问的网站图标，先不管它。
在访问一个乱码地址试试：localhost:8888/hdasfiuhlksdfhl
果然控制台打出了
GET
/hdasfiuhlksdfhl
所以对路由作出限制：
...
http.createServer(function(request, response) {
...
// 限制请求符合这个条件：
if (request.method === 'GET' && request.url === '/') {
// 返回首页内容
fs.readFile(...);
} else {
...
}
}).listen(port);
// 终端打印如下信息
console.log('Server running at http://127.0.0.1:' + port + '/');
目前为止整理过的server.js:
var http = require('http');
var fs = require('fs')
var port = process.env.PORT || 8888
http.createServer(function(request, response) {
// console.log(request.method)
// console.log(request.url)
if (request.method === 'GET' && request.url === '/') {
indexHandler(request, response)
} else {
normalHandler(request, response)
}
}).listen(port);
// 终端打印如下信息
console.log('Server running at http://127.0.0.1:' + port + '/');
// --------------------- LIB --------------------- //
// 输出首页
function indexHandler(request, response) {
fs.readFile('views/index.html', function(err, data) {
response.writeHead(200, { 'Content-Type': 'text/html', 'Content-Length': data.length });
response.write(data);
response.end();
});
}
// 默认情况
function normalHandler(request, response) {
// 发送 HTTP 头部
// HTTP 状态值: 200 : OK
// 内容类型: text/plain
response.writeHead(200, { 'Content-Type': 'text/plain' });
// 发送响应数据 "Hello World"
response.end('Hello World\n');
}
Express
在Express这边，代码比较简单，路由问题也很简单，但是文件路径问题会比较复杂。先来一个想当然的栗子：
// 这是一个错误的例子：
app.get('/', function(req, res) {
res.status(200).type('html')
.sendFile('views/index.html')
});
- app.get()是限制只有在get请求时才返回这个页面。不想限制可以使用
app.all()
这个例子会报错：
TypeError: path must be absolute or specify root to res.sendFile
翻译：路径必须是绝对的或是相对于res.sendFile的。
原因我暂时解释不了……
来看解决方法：
- 告知框架，这是一个绝对路径：
真可惜，直接写/views/index.html会告诉你找不到这个文件，原因依然解释不了。所以只能用一个参数来指定：res.status(200).type('html') .sendFile('views/index.html', { root: '.' }) -
推荐！node中又一个path模块，专门用来解决路径问题。它的功能很强大，不但能自动合成绝对路径，也能兼容windows和linux不同的文件系统。推荐使用path模块，未来这个服务器的功能会越来越强，一个成熟的路径模块可以帮你跳过不少奇怪的问题。
上代码：
path模块的文档地址：http://nodejs.cn/api/path.htmllet path = require('path') ... res.status(200).type('html') .sendFile(path.join(__dirname, './views', 'index.html'))
相对于res.sendFile的思路太麻烦，不考虑了。
这会儿你的简单网页已经可以正常显示了！前提是，网页上没有引用本服务器的静态资源，比如图片、css什么的，因为其他路径还没有处理呢。
