express

原生的http在某些方面表现不足以应对我们的开发需求,所以需要使用框架来加快我们的开发效率,框架的目的就是提高效率,让我们的代码更高度统一。

安装:

npm install express --save

hello world 示例

const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res) => res.send('Hello World!'))

app.listen(port, () => console.log(`Example app listening on port ${port}!`))

基本路由

get:

app.get('/', (req, res) => res.send('Hello World!'))

post:

app.post('/', (req, res) => res.send('got a post request'))

静态资源

提供图像、CSS文件等静态资源,可使用express.static内置中间件功能

语法:

express.static(root, [options])

root参数指定提供静态资产的根目录

app.use(express.static('public'))
//express相对于root查找静态目录,静态目录的名称并不是url的一部分,例如访问/public/a.js,使用 http://localhost:3000/a.js 访问

可多次调用express.static使用多个静态资源目录

app.use(express.static('public'))
app.use(express.static('files'))

也可以为静态资源提供路径前缀

app.use('/a', express.static('public'))
//使用 http://localhost:3000/a.js 访问

app.use('/abc/d', express.static('public'))
//使用 http://localhost:3000/abc/d/a.js 访问

在express中使用模板引擎

与Express一起使用的一些流行模板引擎是pug,Mustache和EJS。 Express应用程序生成器使用Jade作为默认设置,但它也支持其他几个。

Jade已更名为pug

有关可以与Express一起使用的模板引擎的列表,参见https://github.com/expressjs/express/wiki#template-engines

要渲染模板文件,需在app.js中设置以下属性:

  • views  模板文件所在的目录,默认为根目录中的views目录
  • view engine  需要使用的模板引擎

然后安装相应的模板引擎npm软件包;例如安装Pug:

npm install pug --save

设置视图引擎后,无需指定引擎或在应用程序中加载模板引擎模块, Express会在内部加载模块。第二个参数是文件名后缀。如下

app.set('view engine', 'pug')

如修改模板文件所在目录,如下

app.set('views', './files')

在指定的views目录中创建一个名为index.pug的Pug模板文件,其内容如下

html
  head
    title= title
  body
    h1= message

之后在app.js中render

res.render('html模板名', { 模板数据 })

第一个参数不用写路径,默认会去项目中的views目录查找改模板

app.get('/', (req, res) => {
    res.render('index', {
        title: 'hi',
        message: 'hello world'
    })
})

app.listen(3000, () => console.log('running'))

运行app.js并发送请求,index.pug文件将呈现为HTML

在express中使用nunjucks模板引擎

下载安装nunjucks,app.js如下

const express = require('express')
const nunjucks = require('nunjucks')

const app = express()

app.set('view engine', 'njk')  //文件名后缀是njk

nunjucks.configure('views', { autoescape: true, express: app });

app.get('/', (req, res) => {
    res.render('index', {
        title: 'hi',
        message: 'hello world'
    })
})

app.listen(3000, () => console.log('running'))

如果渲染的模板文件仍想保持后缀名为html,可以如下

const express = require('express')
const nunjucks = require('nunjucks')

const app = express()

app.set('view engine', 'html')  //与上面代码不同的只有第二个参数

nunjucks.configure('views', { autoescape: true, express: app });

app.get('/', (req, res) => {
    res.render('index', {
        title: 'hi',
        message: 'hello world'
    })
})

app.listen(3000, () => console.log('running'))

这样会找./views目录下的index.html文件

在express中获取get请求参数

app.get('/post', (req, res) => {
    console.log(req.query)
})

在express中获取post请求参数

参考中间件 body-parser

中间件

body-parser

当使用post请求时,不能像get请求一样通过req.query获取请求主体

express中没有内置获取表单post请求体的API,这里我们需要使用第三方包

安装

npm i -S body-parser

引包

const bodyParser = require('body-parser')

配置

app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())

app.post('/pinglun', (req, res) => {
    const comment = req.body    //post请求主体
})

 

posted @ 2020-03-30 23:49  懒懒同学不懒  阅读(270)  评论(0编辑  收藏  举报