const exphbs = require('express-handlebars'); // 配置模板引擎 app.engine('html', exphbs({ layoutsDir: 'views', defaultLayout: 'layout', extname: '.html' })); app.set('view engine', 'html');
修改根路径处理函数
// 匹配根路由 / (如果不特别指明返回的状态码, 则默认返回200) app.get('https://www.jb51.net/', function(req, res) { res.render('index', { layout: false, title: "首页", personInfoList: [{ name: "王炮儿(一拳超人)", age: 20 }, { name: "炮姐(御坂美琴)", age: 15 }] }); });
在根目录下创建文件夹 views , 并创建 index.html ,
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>{{title}}</title> </head> <body> <h1>人物介绍</h1> {{#each personInfoList}} <h2>昵称:{{this.name}}</h2> <h2>年龄:{{this.age}}</h2> <hr> {{/each}} </body> </html>
最终效果
express-simple-server.js 源码
const express = require('express'); const exphbs = require('express-handlebars'); const app = express(); // 配置模板引擎 app.engine('html', exphbs({ layoutsDir: 'views', defaultLayout: 'layout', extname: '.html' })); app.set('view engine', 'html'); // 如果在环境变量内, 设定了程序运行端口，则使用环境变量设定的端口号, 否则使用3000端口 app.set('port', process.env.PORT || 3000); // 匹配静态文件目录 app.use(express.static(__dirname + '/public')); // 匹配根路由 / (如果不特别指明返回的状态码, 则默认返回200) app.get('https://www.jb51.net/', function(req, res) { res.render('index', { layout: false, title: "首页", personInfoList: [{ name: "王炮儿(一拳超人)", age: 20 }, { name: "炮姐(御坂美琴)", age: 15 }] }); }); // 定制 404 页面 (返回404状态码) app.use(function(req, res) { let currentTime = new Date(); res.type('text/plain'); res.status(404); res.send('404 - 你访问的页面可能去了火星\n' + currentTime); }); //定制 500 页面 (返回500状态码) app.use(function(err, req, res, next) { let currentTime = new Date(); let errInfo = err.stack; res.type('text/plain'); res.status(500); res.send('500 - 服务器发生错误\n' + 'errInfo:' + errInfo + '\n' + 'currentTime:' + currentTime); }); // 监听服务端口, 保证程序不会退出 app.listen(app.get('port'), function() { console.log('Express 服务正在运行在 :' + app.get('port') + '; 按 Ctrl-C 关闭服务.'); });
package.json
{ "name": "express-simple-server", "version": "1.0.0", "description": "", "main": "express-simple-server.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "node express-simple-server.js" }, "keywords": [], "author": "", "license": "ISC", "dependencies": { "express": "^4.16.4", "express-handlebars": "^3.0.0" } }
小结：
如果你想通过一门编程语言实现全栈， javascript是你的不二之选（其实也没得选，浏览器能运行的图灵完备的语言只有javascript）， Express是一个很基础的nodejs框架， 把Express学通， 其他nodejs后端框架也就一通百通了