零基础入门Express

nodemon
安装npm install -g nodemon
运行：nodemon

1.express介绍

  • express是什么呢？
    express是基于Node.js平台，快速/开发/极简的web开发框架
  • express能够做什么呢？
    他能够写一些web的应用/写一个网站/聊天室/商城/给前端提供API
  • 如何安装？
    npm install express --save
  • express的特性
    1. 它是一个简单的路由系统
    2. 它集成了很多模版引擎
    3. 它是一个中间件系统
  • 一个简单的express实例
// 导入express模块
var express = require('express');
//形成实例
var app = express();
//get方法 生成路由
app.get('/',(req,res)=>{
    res.send('this is homepage')
})
//监听在一个端口上
app.listen(3000);
nodemon 运行
127.0.0.1:3000直接访问到路由

2.express的应用Application

这个app对象通常表示Express应用程序，通过调用express()Express模块导出的顶级函数来创建它

var express = require("express");
var app = express();

属性

  • app.locals
    这个对象的属性是应用程序中的局部变量。

事件

  • app.on('mount',callback(parent))
    当子应用程序挂载到父应用程序上时，会触发mount事件

方法

  • app.all(path,callback[,callback])
  • app.listen([port[,host[,backlog]]][,callback])
    绑定并侦听指定主机和端口上的连接
    app.listen(3000)
  • app.delete()
    用指定的回调函数将HTTP DELETE 请求路由到指定的路径
  • app.get()
    用指定的回调函数将HTTP GET请求路由到指定的路径
  • app.post()
    用指定的回调函数将HTTP POST请求路由到指定的路径
    表带提交使用Post提交
    模拟表单数据安装body-parser插件

x-www-form-urlencoded:标准的表单提交
form-data:有文件上传的表单提交

body-parser官网
npm install body-parser --save
multer:处理文件上传
安装：npm install --save multer
博客推荐：

image.png

文件上传实例：

var express = require('express');
var bodyParser = require('body-parser');
var fs = require('fs'); 
var app = express();
var multer  = require('multer');
var createFolder = (folder)=>{
    try{
        fs.accessSync(folder)
    }catch(e){
        fs.mkdirSync(folder)
    }
}
var uploadFolder = './upload/'
createFolder(uploadFolder);
var storage = multer.diskStorage({
    destination: function (req, file, cb) {
      cb(null, uploadFolder)
    },
    filename: function (req, file, cb) {
      cb(null, file.originalname)
    }
  })
   
  var upload = multer({ storage: storage })

// parse application/x-www-form-urlencoded
//中间件函数，就是在请求和响应之间，把请求内容进行处理 
app.use(bodyParser.urlencoded({ extended: false }))
app.get('/form',(req,res)=>{
    var form = fs.readFileSync('./form.html',{encoding:"utf8"}) 
    res.send(form); 
})
//模拟post请求，谷歌浏览器Postman插件
app.post('/upload',upload.single('logo'), (req,res)=>{
    console.dir(req.file);
    /**{ fieldname: 'logo',
     originalname: 'test.py',
    encoding: '7bit',
    mimetype: 'text/x-python-script',
    destination: './upload/',
    filename: 'logo-1566119695314',
    path: 'upload/logo-1566119695314',
    size: 7 }
   */
    res.send({'render_code':0})
})
app.listen(3000);
// parse application/json
//处理JSON数据
// app.use(bodyParser.json())


// app.use(function (req, res) {
//     res.setHeader('Content-Type', 'text/plain')
//     res.write('you posted:\n')
//     res.end(JSON.stringify(req.body, null, 2))
// })
上传成功的文件

3.express的响应Response

Res对象表示Express应用程序在收到HTTP请求时发送的HTTP响应。

var express = require('express');
var app = express();
app.get('/person/:id',(req,res)=>{
    res.send('user:'+req.params.id)
})
app.listen(3000)
image.png

res的属性

  • res.headersSent表示应用程序是否为响应发送了HTTP Header
app.get('/person/:id',(req,res)=>{
    console.dir(res.headersSent)//false
    res.send('user:'+req.params.id)
    console.dir(res.headersSent)//true
})

res的方法

  • res.append(field[,value])
    将指定的内容追加value到HTTP响应头field。
  • res.attachment([文件名])
    将http响应Content-Disposition头字段设置为"attachment"
  • res.cookie(name,value,[,options])
    设置cookie
属性 类型 描述
domain 串 cookie的域名，默认为应用程序的域名
encode 功能 用于cookie值编码的同步函数
expires 日期 cookie到期日
httpOnly 布尔 标记cookie只能由web服务器访问
maxAge 数 用于设置相对于当前时间的到期时间
path 串 Cookie的路径
secure 布尔 将cookie标记为仅与HTTPS一起使用
signed 布尔 指示cookie是否应该签名
sameSite 布尔或串 Set-Cookie属性的值 
res.cookie('name','tangjiao',{
    domain:'.qq.com',
    httpOnly:true,
    expires:new Date(new Date().getTime()+9000),
    path:'/person',
    maxAge: 12000000,
})
  • res.clearCookie(name,[,options])
    清除指定的cookie name
    res.clearCookie('name',{path:'admin'})
  • res.end([data][,encoding])
    结束响应过程
    res.end
  • res.json()
    发送JSON响应
    res.json({user:'tang'})
  • res.jsonp()
    使用jsonp支持发送json响应
    res.jsonp({user:'tang'})
  • res.redirect([status,]path)
    重定向到指定的url
res.redirect('/foo/bar');
res.redirect(301,'www.baidu.com')
  • res.render(view[,locals][,callback])
    将要呈现的HTML字符串发送到客户端
  • res.send([body])
    发送HTTP响应
    re.send('hello world')
  • res.sendFile(path[,options][,fn])
  • res.sendStatus
    将响应HTTP状态代码设置为statusCode并将其字符串表示形式发送为响应正文。
    res.sendStatus(200)//相当于res.status(200).send('OK')

4.express的请求Request

该req对象表示HTTP请求，并具有请求查询字符串，参数，正文，HTTP Header等的属性。

res.get('/user/:id',(req,res)=>{
    res.send(req.params.id)
})

属性

  • req.app
    表示对使用中间件的Express应用程序实例的引用
  • req.baseUrl
    安装路由器实例的URL路径
  • req.body
    表示请求正文中提交的键值对数据
  • req.cookies
    包含请求发送的cookie的对象
  • req.hostname
    表示http请求的主机名
  • req.ip
    表示请求的ip地址
  • req.params
    表示路由映射的参数
  • req.query
    表示路由中每个查询字符串的属性

方法

  • req.get()
    返回指定的HTTP请求表头字段
req.get("Content-Type");//"text/plain"

5.express的路由Router

路由器对象是中间件和路由的独立实例。您可以将其视为一个“迷你应用程序”，仅能执行中间件和路由功能。每个Express应用程序都有内置的应用程序路由器。

方法

  • router.all(path,[callback,]callback)
    它匹配所有的路由方法
  • router.get()
    匹配get请求
router.get('/user',(req,res)=>{
    res.send('user')
})

6.将模板引擎用于 Express

在 Express 可以呈现模板文件之前，必须设置以下应用程序设置：

views：模板文件所在目录。例如：app.set('views', './views')
view engine：要使用的模板引擎。例如：app.set('view engine', 'pug')
然后安装对应的模板引擎 npm 包：
npm install ejs --save

7.中间件

中间件函数是可以访问request/response以及app的request-response周期的下一个中间件函数的函数，下一个中间件函数由next()表示。
中间件函数的功能：

  • 全局更改请求和响应对象
  • 调用堆栈中的下一个中间件函数

中间件的类型

i.app的中间件

var app = express()
//没有装载路径的中间件功能，每次app收到请求时都会执行该功能
app.use((req,res,next)=>{
    console.log('Time:'+Date.now())
    next();
})
//此示例显示了路由及其处理函数（中间件系统）。该函数处理对/user/:id路径的GET请求。
app.get('/user/:id', function (req, res, next) {
  res.send('USER')
})

ii.router的中间件

和app中间件功能一致，只不过它被绑定到一个实例express.Router()。

iii.错误处理中间件

以与其他中间件函数相同的方式定义错误处理中间件函数，除了四个参数而不是三个，特别是(err, req, res, next)）：

app.use(function (err, req, res, next) {
  console.error(err.stack)
  res.status(500).send('Something broke!')
})

iv.第三方中间件

使用第三方中间件为Express应用程序添加功能
app.use(bodyParser.urlencoded({ extended: false }))

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 206,214评论 6赞 481
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 88,307评论 2赞 382
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 152,543评论 0赞 341
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 55,221评论 1赞 279
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 64,224评论 5赞 371
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 49,007评论 1赞 284
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 38,313评论 3赞 399
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 36,956评论 0赞 259
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 43,441评论 1赞 300
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,925评论 2赞 323
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,018评论 1赞 333
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 33,685评论 4赞 322
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 39,234评论 3赞 307
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,240评论 0赞 19
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,464评论 1赞 261
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 45,467评论 2赞 352
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 42,762评论 2赞 345

推荐阅读更多精彩内容