express
// 0. 安装
npm i express
// 1. 引包
var express = require('express')
// 2. 创建你服务器应用程序
// 也就是原来的 http.createServer
var app = express()
// 在 Express 中开放资源就是一个 API 的事儿
// 公开指定目录
// 只要这样做了,你就可以直接通过 /public/xx 的方式访问 public 目录中的所有资源了
app.use('/public/', express.static('./public/'))
app.use('/static/', express.static('./static/'))
app.use('/node_modules/',express.static('./node_modules/'))
// 模板引擎,在 Express 也是一个 API 的事儿
// 得到路径
// 一个一个的判断
// 以前的代码很丑
app.get('/about', function (req, res) {
// 在 Express 中可以直接 req.query 来获取查询字符串参数
console.log(req.query)
res.send('你好,我是 Express!')
})
app.get('/pinglun', function (req, res) {
// req.query
// 在 Express 中使用模板引擎有更好的方式:res.render('文件名, {模板对象})
// 可以自己尝试去看 art-template 官方文档:如何让 art-template 结合 Express 来使用
})
// 当服务器收到 get 请求 / 的时候,执行回调处理函数
app.get('/', function (req, res) {
res.send(`
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<h1>hello Express!你好</h1>
</body>
</html>
`)
})
// 相当于 server.listen
app.listen(3000, function () {
console.log('app is running at port 3000.')
})
nodemon 文件变化自动启动服务器
//--global 全局安装在哪个目录安装都可以
//-g
npm i --global nodemon
配置art-template
模板引擎
1.npm i art-template express-art-template
app.engine('html',require('express-art-template'))
- 子模板
- 模板继承
路由设计
路径 | 方法 | get参数 | post参数 | 是否需要登录权限 | 备注 |
---|---|---|---|---|---|
/ | GET | 渲染首页 | |||
/register | GET | 渲染注册页面 | |||
/register | POST | email、nickname,password | 处理注册请求 | ||
/ login | GET | 渲染登录页面 | |||
/login | POST | email,password | 处理登陆请求 | ||
/logout | GET | 处理退出请求 |
在Express获取表单POST请求体数据
使用第三方包 body-parser
安装:
npm i body-parser --save
配置:
var bodyParser = require('body-parser')
//配置 body-parser
//只要加入这个配置,则在req请求对象上会多出来一个属性:body
//这样就可以直接通过req.body来获取表单POST请求体数据了
//parse application/x-www-form-urlencoded
app.use(bodyParser.urlencode({extended:false}))
//parse application/json
app.use(bodyParser.json())
数据库mongoDB
npm i mongoose
var mongoose = require('mongoose')
var schema = mongoose.Schema
// 1. 连接数据库
// 指定连接的数据库不需要存在,当你插入第一条数据之后就会自动被创建出来
mongoose.connect('mongodb://localhost/itcast')
// 2. 设计文档结构(表结构)
// 字段名称就是表结构中的属性名称
// 约束的目的是为了保证数据的完整性,不要有脏数据
var userSchema = new Schema({
username: {
type: String,
required: true // 必须有
},
password: {
type: String,
required: true
},
email: {
type: String
}
})
// 3. 将文档结构发布为模型
// mongoose.model 方法就是用来将一个架构发布为 model
// 第一个参数:传入一个大写名词单数字符串用来表示你的数据库名称
// mongoose 会自动将大写名词的字符串生成 小写复数 的集合名称
// 例如这里的 User 最终会变为 users 集合名称
// 第二个参数:架构 Schema
//
// 返回值:模型构造函数
var User = mongoose.model('User', userSchema)
// 4. 当我们有了模型构造函数之后,就可以使用这个构造函数对 users 集合中的数据为所欲为了(增删改查)
// **********************
// #region /新增数据
// **********************
// var admin = new User({
// username: 'zs',
// password: '123456',
// email: 'admin@admin.com'
// })
// admin.save(function (err, ret) {
// if (err) {
// console.log('保存失败')
// } else {
// console.log('保存成功')
// console.log(ret)
// }
// })
// **********************
// #endregion /新增数据
// **********************
// **********************
// #region /查询数据
// **********************
// User.find(function (err, ret) {
// if (err) {
// console.log('查询失败')
// } else {
// console.log(ret)
// }
// })
// User.find({
// username: 'zs'
// }, function (err, ret) {
// if (err) {
// console.log('查询失败')
// } else {
// console.log(ret)
// }
// })
// User.findOne({
// username: 'zs'
// }, function (err, ret) {
// if (err) {
// console.log('查询失败')
// } else {
// console.log(ret)
// }
// })
// **********************
// #endregion /查询数据
// **********************
// **********************
// #region /删除数据
// **********************
// User.remove({
// username: 'zs'
// }, function (err, ret) {
// if (err) {
// console.log('删除失败')
// } else {
// console.log('删除成功')
// console.log(ret)
// }
// })
// **********************
// #endregion /删除数据
// **********************
// **********************
// #region /更新数据
// **********************
// User.findByIdAndUpdate('5a001b23d219eb00c8581184', {
// password: '123'
// }, function (err, ret) {
// if (err) {
// console.log('更新失败')
// } else {
// console.log('更新成功')
// }
// })
// **********************
// #endregion /更新数据
// **********************
在models中创建数据模型
处理注册请求
- 获取表单数据
- 处理 (查询数据库) 定义状态码
- 发送响应 返回 状态码
前端收到状态码,做出相应友好提示
密码MD5加密
router.post('/register', async function (req, res) {
// var body = req.body
// try {
// if (await User.findOne({ email: body.email })) {
// return res.status(200).json({
// err_code: 1,
// message: '邮箱已存在'
// })
// }
// if (await User.findOne({ nickname: body.nickname })) {
// return res.status(200).json({
// err_code: 2,
// message: '昵称已存在'
// })
// }
// // 对密码进行 md5 重复加密
// body.password = md5(md5(body.password))
// // 创建用户,执行注册
// await new User(body).save()
//通过session保存登录状态
// req.session.user=user
// res.status(200).json({
// err_code: 0,
// message: 'OK'
// })
// } catch (err) {
// res.status(500).json({
// err_code: 500,
// message: err.message
// })
// }
// })
$('#register_form').on('submit', function (e) {
e.preventDefault()
var formData = $(this).serialize()
$.ajax({
url: '/register',
type: 'post',
data: formData,
dataType: 'json',
success: function (data) {
var err_code = data.err_code
if (err_code === 0) {
// window.alert('注册成功!')
// 服务端重定向针对异步请求无效
window.location.href = '/'
} else if (err_code === 1) {
window.alert('邮箱已存在!')
} else if (err_code === 2) {
window.alert('昵称已存在!')
} else if (err_code === 500) {
window.alert('服务器忙,请稍后重试!')
}
}
})
})
window.location.href = ‘/’
- 登录成功 通过session保存登录状态 express-session插件
一般session数据会被持久化保存的
- 登录时 是用加密了密码和数据库中密码进行比对
- 退出 清除登录状态
重定向到登录页
// 清除登陆状态
req.session.user = null
// 重定向到登录页
res.redirect('/login')