一、express

可以做：web application、api...

特性：

  • 适合写简单的路由系统
  • 集成很多模板引擎
  • 中间件系统

二、请求与响应

  1. var express = require('express');
  2.  
  3. var app = express();
  4.  
  5. //据说第二个参数是一个中间件方法
  6. app.get('/', function(req, res) {
  7.     //学会查api来学习更多知识，学会学习官方api文档
  8.     var resObj = req.method;
  9.     //send可以发送字符串、json（包含自动stringify）对象和数组
  10.     res.send(resObj);
  11. })
  12.  
  13. app.listen(3000);
  14. console.log('listening to port 3000');

三、路由参数

server.js

  1. var express = require('express');
  2.  
  3. var app = express();
  4.  
  5. app.get('/profile/:id/user/:name', function(req, res) {
  6.     console.dir(req.params);
  7.     res.send('you requested to a profile page with the name of ' + req.params.name);
  8. })
  9.  
  10. app.listen(3000);
  11. console.log('listening to port 3000');

terminal

chrome

四、查询字符串

server.js

  1. app.get('/', function(req, res) {
  2.     console.dir(req.query);
  3.     res.send('home page:' + req.query.find);
  4. })

terminal

chrome

五、post请求和postman工具

同时处理x-www-form和json

  1. var express = require('express');
  2. var bodyparser = require('body-parser');
  3.  
  4. var app = express();
  5.  
  6. //create application/json parser
  7. var jsonParser = bodyparser.json();
  8.  
  9. //create application/x-www-form-urlencoded parser
  10. var urlencodedParser = bodyparser.urlencoded({ extended: false})
  11.  
  12. app.post('/', urlencodedParser,function (req, res) {
  13.     console.dir(req.body);
  14.     res.send(req.body.name);
  15. })
  16.  
  17. app.post('/upload', jsonParser, function (req, res) {
  18.     console.dir(req.body);
  19.     res.send(req.body.name);
  20. })

参考链接：github/express/body-parser

六、上传文件

form.html

  1. <body>
  2.     <form action="/upload" method="post" enctype="multipart/form-data">
  3.         <h2>单图上传</h2>
  4.         <input type="file" name="logo">
  5.         <input type="submit" value="submit">
  6.     </form>
  7. </body>

server.js

  1. var express = require('express');
  2. var bodyparser = require('body-parser');
  3. var fs = require('fs');
  4. var multer = require('multer');
  5. var upload = multer({ dest: 'uploads/'});
  6. var app = express();
  7.  
  8. //create application/json parser
  9. var jsonParser = bodyparser.json();
  10.  
  11. //create application/x-www-form-urlencoded parser
  12. var urlencodedParser = bodyparser.urlencoded({ extended: false})
  13.  
  14. app.get('/', function(req, res) {
  15.     console.dir(req.query);
  16.     res.send('home page:' + req.query.find);
  17. })
  18.  
  19. app.get('/form', function(req, res) {
  20.     var form = fs.readFileSync('./form.html', { encoding: 'utf8'});
  21.     res.send(form);
  22. })
  23.  
  24. app.post('/', urlencodedParser,function (req, res) {
  25.     console.dir(req.body);
  26.     res.send(req.body.name);
  27. })
  28.  
  29. app.post('/upload', upload.single('logo'),function (req, res) {
  30.     res.send({'ret_code': 0});
  31. })
  32.  
  33. app.listen(3000);
  34. console.log('listening to port 3000');

结构变化

参考链接：github/express/multer

tips:

  1. app.get('/form', function(req, res) {
  2.     var form = fs.readFileSync('./form.html', { encoding: 'utf8'});
  3.     res.send(form);
  4. })

等价于

  1. app.get('/form', function(req, res) {
  2.     res.sendFile(__dirname + '/form.html');
  3. })

七、模板引擎

引入

  1. app.set('view engine', 'ejs');

使用

server.js

  1. app.get('/form/:name', function(req, res) {
  2.     var person = req.params.name;
  3.     res.render('form', { person: person});
  4.     res.sendFile(__dirname + '/form.html');
  5. })

form.ejs

  1. <h1><%= person %></h1>

遍历数组

  1. <ul>
  2.     <%= data.hobbie.forEach(function(item){ %>
  3.         <li>
  4.             <%= item %>
  5.         </li>
  6.     <%= }) %>
  7. </ul>

公用模板

使用

  1. <%- include('partials/header.ejs') -%>

about.ejs

  1. <body>
  2.     <%- include('partials/header.ejs') -%>
  3. </body>

渲染

  1. app.get('/about', function(req, res) {
  2.     var data = {age: 29, job: 'programmer', hobbie: ['eating', 'fighting', 'fishing']};
  3.     res.render('about', { data: data});
  4. })

参考链接：ejs.co、pug

八、中间件

解释：请求与响应之间的处理过程是中间件发挥作用的地方。

好处：共用模块、全局性的操作

类型：

  • 应用级中间件
  • 路由级中间件
  • 错误层次中间件
  • 内置中间件
  • 第三方中间件

执行顺序

  1. app.use(function(req, res, next){
  2.     console.log('1');
  3.     next();
  4.     console.log('3');
  5. })
  6.  
  7. app.use(function(req, res, next){
  8.     console.log('2');
  9. })

路由中间件

server.js

  1. var indexRouter = require('./routes/index.js');
  2. var userRouter = require('./routes/user.js');
  3.  
  4. app.use('/', indexRouter);
  5. app.use('/users', userRouter);

./route/index.js

  1. var express = require('express');
  2.  
  3. var router = express.Router();
  4.  
  5. router.get('/', function(req, res, next) {
  6.     res.send('root');
  7. })
  8.  
  9. module.exports = router;

./route/user.js

  1. var express = require('express');
  2.  
  3. var router = express.Router();
  4.  
  5. router.get('/', function(req, res, next) {
  6.     res.send('user');
  7. })
  8.  
  9. module.exports = router;

体会：用中间件写路由的好处

参考链接：express/using-middleware

express组件学习的更多相关文章

  1. C# BackgroundWorker组件学习入门介绍

    C# BackgroundWorker组件学习入门介绍 一个程序中需要进行大量的运算,并且需要在运算过程中支持用户一定的交互,为了获得更好的用户体验,使用BackgroundWorker来完成这一功能 ...

  2. bootstrap组件学习

    转自http://v3.bootcss.com/components/ bootstrap组件学习 矢量图标的用法<span class="glyphicon glyphicon-se ...

  3. C# BackgroundWorker组件学习

    C# BackgroundWorker组件学习  C# BackgroundWorker组件学习 一个程序中需要进行大量的运算,并且需要在运算过程中支持用户一定的交互,为了获得更好的用户体验,使用Ba ...

  4. [Python] wxPython 状态栏组件、消息对话框组件 学习总结(原创)

    1.状态栏组件 1.基本介绍 上图: 红框框内的就是状态栏. 他可以分成若干个区块,比如上者分为了两个区块,并且比例是固定的,创建时可以指定 每个区块都能够显示 信息,一般通过 绑定事件 实时更新 各 ...

  5. Vue组件学习

    根据Vue官方文档学习的笔记 在学习vue时,组件学习比较吃力,尤其是组件间的通信,所以总结一下,官方文档的组件部分. 注册组件 全局组件 语法如下,组件模板需要使用一个根标签包裹起来.data必须是 ...

  6. 开始nodejs+express的学习+实践（1）

    开始nodejs+express的学习+实践(1) 开始nodejs+express的学习+实践(2) 开始nodejs+express的学习+实践(3) 开始nodejs+express的学习+实践 ...

  7. vue组件学习(二)

    父子组件之间的数据传递, 父传给子: 直接在组件上传,如:<count :number="2"> (冒号和不要冒号的区别,有冒号会自动转为相应的类型)在名为count的 ...

  8. vue组件学习(一)

    1, vue中的 is 的用法,有时候我们需要把一个组件绑定到指定的标签下,比如把tr组件放到table下,直接这样写是不行的, <!DOCTYPE html> <html lang ...

  9. express 的学习 （1）

    - 安装`npm i express -S` - :引入express第三方对象 - :构建一个服务器对象 - :开启服务器监听端口 - :处理响应 1.下载 新建一个文件夹,cmd 进去,使用命令 ...

随机推荐

  1. centos下搭建高可用redis

    Linux下搭建高可用Redis缓存 Redis是一个高性能的key-value数据库,现时越来越多企业与应用使用Redis作为缓存服务器.楼主是一枚JAVA后端程序员,也算是半个运维工程师了.在Li ...

  2. NSUserDefault存储类

    类要实现NSCoding协议 实现encodeWithCoder和initWithCoder方法 先把类的instance archive成NSData,然后存起来 TGTest *tt = [TGT ...

  3. P3267 [JLOI2016/SHOI2016]侦察守卫

    $ \color{#0066ff}{ 题目描述 }$ 小R和B神正在玩一款游戏.这款游戏的地图由N个点和N-1条无向边组成,每条无向边连接两个点,且地图是连通的.换句话说,游戏的地图是一棵有N个节点的 ...

  4. php图像处理函数image_type_to_extension、image_type_to_mime_type 的区别

    php中获得图像类型的两个函数image_type_to_extension.image_type_to_mime_type,做图像处理的时候一直不清楚这俩个函数有什么区别,今天特意查了一下,有了一些 ...

  5. python lambda匿名函数 用法

    语法 lambda argument_list: expression argument_list是参数列表 expression是一个关于参数的表达式.表达式中出现的参数需要在argument_li ...

  6. scikit-learn中predict_proba用法 (与predict的区别）

    predict_proba返回的是一个 n 行 k 列的数组, 第 i 行 第 j 列上的数值是模型预测 第 i 个预测样本为某个标签的概率,并且每一行的概率和为1. # conding :utf-8 ...

  7. 基于iTop4412的FM收音机系统设计(一)

    说明:第一版架构为:APP+JNI(NDK)+Driver(linux),优点是开发简单,周期短,也作为自己的毕业设计 现在更新第二版,FM服务完全植入Android系统中,成为系统服务,架构为:AP ...

  8. API Monitor程序分析工具简介

    API Monitor是一个免费软件,可以让你监视和控制应用程序和服务,取得该应用程序的API调用情况. 它是一个强大的工具,看到的应用程序和服务是如何工作的,或跟踪,你在自己的应用程序的问题. AP ...

  9. 数论(Lucas定理) HDOJ 4349 Xiao Ming's Hope

    题目传送门 题意:求C (n,0),C (n,1),C (n,2)...C (n,n)中奇数的个数 分析:Lucas 定理:A.B是非负整数,p是质数.AB写成p进制:A=a[n]a[n-1]...a ...

  10. 02-线性结构3 Reversing Linked List （25 分)

    Given a constant K and a singly linked list L, you are supposed to reverse the links of every K elem ...