Express 学习
- 安装 Express
npm install -g express-generator
- 查看版本号
express --version
- 创建项目
express hello
- 安装依赖包
npm install
- 启动应用
npm start
- 浏览器访问
http://localhost:3000/ - Express 默认应用中的文件 及 作用
- bin: 服务器脚本默认目录
- bin/www.js: 服务器默认脚本，启动服务脚本
- node_modules: 依赖包安装目录
- public: 静态资源目录
- routes: 路由目录，存放路由文件
- routes/index.js 首页路由文件
- routes/users.js 用户路由文件
- views 页面目录
- views/error.jade 错误页面
- views/index.jade 首页
- views/layout.jade 页面共用布局
- app.js 应用主文件， 入口
- package.json 项目配置文件
- package-lock.json 锁定的项目配置文件
- app.js
引入模块，比如cookie 日志 ，然后创建express应用，设置express的一些配置，比如模板引擎，日志打印级别
定义 index.js 和 users.js的路由 - index.js
引入 express, 路由对象
设置get /对应的 js
res.render() 渲染页面，第一个参数是 页面的文件名， 第二个参数是传入到页面的对象。
index.jade
-
自定义路由
在index.js增加如下代码
效果
-
安装nodemon ,修改自动重启项目
npm install -g nodemon
修改 package.json 文件，改为nodemon运行
- 其他方式请求
router.post()
router.put()
router.delete() - 路由匹配规则
模糊匹配 wes?t
正则表达式 - 中间件
共同方法来拦截请求
面向切面编程
express就是一个路由和中间件合成的web框架
router.get('/middle', function(req, res, next){
console.log(' 这是 添加 中间件'); // 增加日志
next(); // 继续下一个中间件
}, function(req, res, next){
console.log('fanhui');
res.send('这是返回')
})
- 更换模板引擎
使用art-template
npm install -S art-template
npm install -S express-art-template
app.js修改如下
// app.set('view engine', 'jade'); // 定义页面模板引擎
app.engine('.html', require('express-art-template'))
app.set('view engine', 'html');
views目录下新建index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<body>
<h1>这是Html文件 {{title}}</h1>
</body>
</head>
</html>
渲染，条件渲染，循环渲染
index.html
<!--基本条件渲染-->
{{ if age>30 }}
<p> 我今年{{age}}岁， 老了</p>
<!--嵌套渲染-->
{{if happy}}
<span>very happy to see you </span>
{{/if}}
{{/if}}
{{ if age<=30 }}
<p> 我今年 还年轻{{age}}</p>
{{/if}}
<!--循环渲染-->
{{each list as item}}
<p>id:{{item.id}} , content: {{item.content}}</p>
{{/each}}
index.js
router.get('/', function(req, res, next) {
res.render('index', {
title: 'HelloCLf',
age: 31,
happy: true,
list: [
{
id:1,
content: '今天星期天'
},
{
id: 2,
content: '今天太阳真暖'
}
]
});
});
- 请求对象 Request
- Request.url 请求地址的属性
- Request.query 获取get请求参数
- Request.body 获取post请求参数
- Request.params 获取url中自定义的参数 /:id
router.get('/book', function(req, res, next){
console.log(req.url)
console.log(req.query)
res.render('test', {title:'book'})
})
router.post('/book/:id', function(req, res, next){
console.log(req.url)
console.log(req.query)
console.log(req.params)
console.log(req.headers)
console.log(req.cookies)
console.log(req.body)
res.render('test', {title:'bookpost'})
})
- 返回对象 Response
Response.render() 渲染页面的方法
参数1：view, string, 是， 页面文件， 用于渲染 的文件路径
参数2：locals, Object 否， 属性定义页面的局部变量
参数3：callback, Function,否，回调函数，自动调用next(err)
Response.send() 发送http响应
只接收一个参数
router.get('/resp', function(req, res, next){
// res.send(new Buffer('hello'))
// res.send({name:'cls'})
// res.send('<p>html</p>')
// res.send([1,2,3])
res.send('some string')
})
Response.json(): 返回json格式的数据
router.get('/json', function(req, res, next){
res.json({
name: 'cls',
age: '28',
hobby: ['打羽毛球', '踢毽子', '吃']
})
})
Response.status() 设定http状态码
Response.redirect() 跳转指定路由
