多日未见，倍感思念，这一章节，讲的还是eggjs的内容，尽量这周有时间就给大家结束eggjs的章节，然后继续更react的内容，原计划是两周时间结束的，毕竟博主太懒了。这栏目结束，后面主要讲react的模块，以及会插着写面试题的相关内容。
一、http知识点复习
1、请求
- get请求
- post请求
- delete请求
- put请求
2、响应
状态：200，404,500等等
数据：json格式，JavaScript对象表示法
{
"name":'小明',
"age":24
}
["香蕉","苹果"]
3、无状态
http是一个无状态的协议
二、服务器如何识别用户
1、使用cookie与session识别用户（cookie存储在客户端，session存储在服务器端）
2、使用JWT（Json Web Token）识别用户
这两者都是让用户保持登录状态
那么如何用session保持用户登录状态
1、登录后可以访问首页
2、未登录，访问首页会跳转到登录页
三、实现保持用户登录状态（session）
1、在view文件夹下（没有，就自己建一个，具体操作请看前面的章节），建两个html页面，一个登录页(login.html)，一个首页(home.html)
//home.html
首页
首页
//login.html
登录页
2、配置路由
'use strict';
/**
* @param {Egg.Application} app - egg application
*/
module.exports = app => {
const {
router,
controller
} = app;
router.get('/', controller.home.index); //默认页
router.get('/home', controller.home.getHome)
router.get('/login', controller.home.login)
};
3、写首页和登录页方法
//home.js
'use strict'; //严格模式
const Controller = require('egg').Controller; //Controller类
class HomeController extends Controller { //定义一个新的类去继承Controller类
async index() {
const {
ctx
} = this;
ctx.body="hi,egg"
}
//首页
async getHome() {
await this.ctx.render("home")
}
//登录页
async login() {
await this.ctx.render("login")
}
}
module.exports = HomeController; //暴露HomeController
4、登录则访问首页，不登录访问不了首页
思路：用户登录的时候给个session，访问首页判断session，有session则访问首页，没有则重定向回登录页。
- 首先需要在路由里面加一个post，提交按钮的方法（就在原本的router.js里面加下面的代码）
router.post('/login', controller.home.doLogin)
- 在home.js里面加上doLogin方法（就在原本的home.js里面加上下面的代码）
//登录
async doLogin() {
let userName = this.ctx.request.body.username
let passWord = this.ctx.request.body.password
if (userName == "xiaoming" && passWord == "123") {
this.ctx.redirect("/home")
} else {
this.ctx.redirect("/login")
}
}
此时我们访问登录页，当我们输入xiaoming以及123的时候，我们就能跳转到首页，而当我们输入的并非这两者的时候，就会重新跳转到登录页
- 当我们加上session进行判断，存储用户名称，直接在地址栏去首页都会进行拦截判断
'use strict'; //严格模式
const Controller = require('egg').Controller; //Controller类
class HomeController extends Controller { //定义一个新的类去继承Controller类
//首页
async getHome() {
if (this.ctx.session.user) {
await this.ctx.render("home")
} else {
this.ctx.redirect('/login')
}
}
//登录页
async login() {
await this.ctx.render("login")
}
//登录
async doLogin() {
let userName = this.ctx.request.body.username
let passWord = this.ctx.request.body.password
if (userName == "xiaoming" && passWord == "123") {
this.ctx.session.user = userName
this.ctx.redirect("/home")
} else {
this.ctx.redirect("/login")
}
}
}
module.exports = HomeController; //暴露HomeController
- 我们为了更完善一点，还要加上注销的功能，实现方式逻辑，就是点击注销，回到登录页面，我们就要清空session，这样回到登录页面，就不会重定向判断去首页了。
- router.js 加上注销的路由(在原本的router.js里面加上下面这一行即可)
router.post('/logout', controller.home.logout)
- 在home.html上加上注销的表单事件(在原本的home.html下面加上这一行即可)
- 在home.js里面加上注销的方法(在原本的home.js里面加上下面这一行即可)
//注销
async logout() {
this.ctx.session.user = ''
this.ctx.redirect('/login')
}
尾语：那么本章就先讲session来实现登录的状态判断，因为怕文章太长，会耽误大家理解，所以就先分开来讲解，文章的末尾会放上传送门以及完整的代码。
完整的代码：
- router.js
'use strict';
/**
* @param {Egg.Application} app - egg application
*/
module.exports = app => {
const {
router,
controller
} = app;
router.get('/', controller.home.index); //默认页
router.get('/home', controller.home.getHome)
router.get('/login', controller.home.login)
router.post('/login', controller.home.doLogin)
router.post('/logout', controller.home.logout)
};
- login.html
登录页
- home.html
首页
首页
-home.js
'use strict'; //严格模式
const Controller = require('egg').Controller; //Controller类
class HomeController extends Controller { //定义一个新的类去继承Controller类
async index() {
const {
ctx
} = this;
this.ctx.body ='hi,egg'
}
//首页
async getHome() {
if (this.ctx.session.user) {
await this.ctx.render("home")
} else {
this.ctx.redirect('/login')
}
}
//登录页
async login() {
await this.ctx.render("login")
}
//登录
async doLogin() {
let userName = this.ctx.request.body.username
let passWord = this.ctx.request.body.password
if (userName == "xiaoming" && passWord == "123") {
this.ctx.session.user = userName
this.ctx.redirect("/home")
} else {
this.ctx.redirect("/login")
}
}
//注销
async logout() {
this.ctx.session.user = ''
this.ctx.redirect('/login')
}
}
module.exports = HomeController; //暴露HomeController
那么本文到这里也就结束了，感谢大家的观看，推荐一首歌《Spin with you》
传送门：
1、第一章 Egg框架概述：https://www.jianshu.com/p/bfdaecb5a18c
2、第二章 路由与控制器：https://www.jianshu.com/p/62edeb088d76
3、第三章 插件：https://www.jianshu.com/p/e8d39f446f46