1. 路由控制的工作原理

//routes/index.js中的代码//访问主页时,调用ejs模板引擎,渲染index.ejs模板文件,生成静态页面,并显示在浏览器中。router.get('/', function(req, res) {   //捕获访问主页的GET请求res.render('index', { title: 'Express' });
});

官方给出的写法是在 app.js 中实现了简单的路由分配,然后再去 index.js 中找到对应的路由函数,最终实现路由功能。

我们不妨把路由控制器和实现路由功能的函数都放到 index.js 里,app.js 中只有一个总的路由接口。

修改后的app.js

 1 //通过require()加载express、path模块。以及routes文件夹下的index.js 和user.js路由文件
 2 var express = require('express');
 3 var path = require('path');
 4 var favicon = require('serve-favicon');
 5 var logger = require('morgan');
 6 var cookieParser = require('cookie-parser');
 7 var bodyParser = require('body-parser');
 8 //加载路由文件
 9 var routes = require('./routes/index');
10 var users = require('./routes/users');
11
12 var app = express();  //生成一个express实例app
13
14 app.set('port', process.env.PORT||3000);//第一章  添加
15 // view engine setup
16 app.set('views', path.join(__dirname, 'views'));//设置 views 文件夹为存放视图文件的目录, 即存放模板文件的地方,__dirname 为全局变量,存储当前正在执行的脚本所在的目录。
17 app.set('view engine', 'ejs');// 设置视图模板引擎为 ejs
18
19 // uncomment after placing your favicon in /public
20 //app.use(favicon(__dirname + '/public/favicon.ico'));   //设置/public/favicon.ico为favicon图标
21 app.use(logger('dev'));//加载日志中间件
22 app.use(bodyParser.json());//加载解析json的中间件
23 app.use(bodyParser.urlencoded({ extended: false }));//加载解析urlencoded请求体的中间件
24 app.use(cookieParser());//加载解析cookie的中间件
25 app.use(express.static(path.join(__dirname, 'public')));//设置public文件夹为存放静态文件的目录
26
27 ////路由控制器    第一章  删减
28 //app.use('/', routes);
29 //app.use('/users', users);
30
31 //第一章  添加
32 routes(app);
33 app.listen(app.get('port'),function(){
34     console.log('Express server listening on port' + app.get('port'));
35 });
36 
37 // catch 404 and forward to error handler     捕获404错误,并转发到错误处理器。
38 app.use(function(req, res, next) {
39     var err = new Error('Not Found');
40     err.status = 404;
41     next(err);
42 });
43
44 // error handlers
45
46 // development error handler
47 // will print stacktrace
48 //开发环境下的错误处理器,将错误信息渲染error模版并显示到浏览器中。
49 if (app.get('env') === 'development') {
50     app.use(function(err, req, res, next) {
51         res.status(err.status || 500);
52         res.render('error', {
53             message: err.message,
54             error: err
55         });
56     });
57 }
58
59 // production error handler
60 // no stacktraces leaked to user
61 //生产环境下的错误处理器,将错误信息渲染error模板并显示到浏览器中。
62 app.use(function(err, req, res, next) {
63     res.status(err.status || 500);
64     res.render('error', {
65         message: err.message,
66         error: {}
67     });
68 });
69
70 //module.exports = app;//导出app实例并供其它模块使用

index.js

 1 //var express = require('express');
 2 //var router = express.Router();  //创建路由实例
 3 //
 4 ///* GET home page. */
 5 //router.get('/', function(req, res) {   //捕获访问主页的GET请求
 6 //  res.render('index', { title: 'Express' });
 7 //});
 8 //
 9 //module.exports = router;//导出路由,并在app中以app.use('/',routes)加载
10
11
12 module.exports = function(app){
13   app.get('/',function(req,res){
14     res.render('index',{title: 'Express'});
15   });
16   app.get('/test',function(req,res){
17     res.send('hello world!');
18   })
19 };

2. 路由规则

express 封装了多种 http 请求方式,主要使用 app.get() 和app.post()

//第一个参数为请求的路径,第二个参数为回调函数(包括req和res两个参数,分别代表请求信息和响应信息)。app.get(**,function(req,res){***});app.post(**,function(req,res){***});

路径请求及对应的获取路径有以下几种形式:

  • req.query: 处理 get 请求,获取 get 请求参数
  • req.params: 处理 /:xxx 形式的 get 或 post 请求,获取请求参数
  • req.body: 处理 post 请求,获取 post 请求体
  • req.param(): 处理 get 和 post 请求,但查找优先级由高到低为 req.params→req.body→req.query

3.  添加路由规则

浏览器打开http://localhost:3000/ 返回“Welcome to Express”界面

打开http://localhost:3000/test, 返回 “404 Not Found”

此时,添加路由:

在index.js 中,添加响应,如下:

之后,打开http://localhost:3000/test,就可以返回“hello world!”界面了。

【上述test,看完效果还回复原代码】

4. 模板渲染ejs

 //__dirname+'/views'为存放视图文件的目录
app.set('views', __dirname + '/views'); //设置模板引擎为ejs
app.set('view engine', 'ejs');

ejs 的标签系统非常简单,它只有以下三种标签:

  • <% code %>:JavaScript 代码。
  • <%= code %>:显示替换过 HTML 特殊字符的内容。
  • <%- code %>:显示原始 HTML 内容。

这里我们不使用layout进行页面布局,而是使用更为简单灵活的include。include 的简单使用如下:

<%- include a %>
hello,world!
<%- include b %>

转载于:https://www.cnblogs.com/xujingbo/p/4166090.html

【nodejs笔记3】Express基本用法,和路由控制,和模板渲染ejs相关推荐

  1. nodejs 实践:express 最佳实践(六) express 自省获得所有的路由

    nodejs 实践:express 最佳实践(六) express 自省获得所有的路由 某些情况下,你需要知道你的应用有多少路由,这在 express 中没有方法可以.因此我这边曲线了一下,做成了一个 ...

  2. NodeJS笔记二---kalrry

    NodeJS笔记二---kalrry NodeJS 服务器 什么是服务器 web服务端保存的资源: web服务器(软件)的作用: nodeJS 介绍 目标 优势 劣势 特点: 环境安装 版本 运行 w ...

  3. nodejs linux模块全局,nodejs笔记一--模块,全局process对象;

    一.os模块可提供操作系统的一些基本信息,它的一些常用方法如下: var os = require("os"); var result = os.platform(); //查看操 ...

  4. SAP UI5 应用开发教程之七十七 - SAP UI5 动态页面路由的高级用法:路由记录 routes 和 target 的一对多关系试读版

    一套适合 SAP UI5 初学者循序渐进的学习教程 教程目录 SAP UI5 本地开发环境的搭建 SAP UI5 应用开发教程之一:Hello World SAP UI5 应用开发教程之二:SAP U ...

  5. Node.js学习笔记(七)#Express框架

    目录 一.Express框架简介 二.安装和使用 1.安装 2.用express创建基本Web服务器 三.Express路由 1.路由概念 2.创建基本路由 ①.创建一个简单的get路由 ② 创建一个 ...

  6. Nodejs笔记之易错点整理

    Nodejs笔记整理 最近学了在b站学了nodejs,一边看一边敲,现在回过来重新看一下代码,并整理一下笔记.文章可能有不严谨的地方,希望多多指教. 关于结束响应 使用http创建服务器是,res() ...

  7. nodejs 实践:express 最佳实践(五) connect解析

    nodejs 实践:express 最佳实践(五) connect解析 nodejs 发展很快,从 npm 上面的包托管数量就可以看出来.不过从另一方面来看,也是反映了 nodejs 的基础不稳固,需 ...

  8. nodejs 框架 中文express 4.xxx中文API手册

       介于最近express 中文文档比较难找的现状,特地找了一个,供大家学习思考 Express 4.x API express 翻译 api文档 中文 -- express() express() ...

  9. python里while的用法_Python学习笔记之While循环用法分析

    本文实例讲述了Python学习笔记之While循环用法.分享给大家供大家参考,具体如下: 前面一篇<Python学习笔记之For循环用法>详细介绍了Python for循环,这里再来讲述一 ...

最新文章

  1. 后端开发之libcurl库编译与安装
  2. 充分理解表达式——《狂人C》习题解答2(第二章习题5)
  3. javaScript中表单的验证
  4. 【caffe】使用draw_net绘制net结构
  5. 为企业门户提供问答式检索--------让系统能回答普通用户提出的问题
  6. html用jq设置动态效果,jQuery实现基本动画效果的方法详解
  7. 删不干净_“我劝你别删前任微信”
  8. 一套完整的用户增长系统架构
  9. 华为自研操作系统最快秋季面市;马化腾谈华为事件;微信支付回应遭封禁 | 极客头条...
  10. fmri 实验设计 / 范式设计/ paradigm design
  11. 集成产品开发团队的组成
  12. JVM,卷走面试官(二)—— 有党性的前端编译
  13. Yolov4部署到ZYNQ系列1-USB转UART驱动不在COM和LPT显示问题的解决方案
  14. git-commit-amend踩坑
  15. Linux WIFI 驱动
  16. linux系统不能用投影仪,Linux连接投影仪(ubuntu)失败或显示不正常--未测试
  17. Package ‘polycor’
  18. 读书笔记 - -《Python网络编程》重点
  19. 【2019/07/20测试 T2】切题
  20. web开发学习,HTML标签语义化

热门文章

  1. scala逻辑运算符的一览图和代码案例
  2. Scala集合:ListBuffer的头head和尾tail
  3. MySQL数据库优化实战
  4. IntelliJ IDEA教程之如何clean或者install Maven项目
  5. c语言p1-melepeo,学生选课系统c语言程序代码
  6. git 常用别名设置
  7. Python Json存储与读取
  8. linux nslookup脚本,Linux中nslookup命令起什么作用呢?
  9. mysql慢日志优化_Mysql优化-慢sql日志
  10. python图形设置_python学习笔记——基本图形绘制