---

前言

记忆在时间面前总是不堪一击！

---

本人的记录，下面内容仅供参考，如有什么什么，请自行解决。

一、cookie和session

不多赘述，详情请看 - https://www.eggjs.org/zh-CN/core/cookie-and-session

二、代码呈现

1.egg部门代码

// 登录
async login(data) {
    const { ctx, app } = this;
    try {
        if (ctx.session.data) {
            return this.success({ message: '请退出登录！' })
        }
        let user = await ctx.model.User.findOne({
            where: {
                userName: {
                    [Op.eq]: data.userName
                },
                password: {
                    [Op.eq]: utility.md5(data.password)
                },
                delete:{
                    [Op.eq]:0
                }
            }
        });
        if (user && user.password === utility.md5(data.password)) {
            // 密码正确，将通过jwt插件生成token，返回给前端
            const token = app.jwt.sign(
                { userName: data.userName },
                app.config.jwt.secret,
                {
                    expiresIn: "5h",// token的有效期，根据情况设置即可
                }
            );
            ctx.cookies.set('token', token)
            delete user.dataValues.password
            let roleId = user.dataValues.roleId;
            let roleInfo = await this.roleID(roleId)
            ctx.session.data = {
                userName: user.dataValues.userName,
                roleName: user.dataValues.roleName,
                administrator: user.dataValues.administrator,
                roleInfo: {
                    roleName: roleInfo[0].dataValues.roleName,
                    dataAuthority: roleInfo[0].dataValues.dataAuthority,
                },
            }
            return this.ctx.body = {
                data: { userInfo: user.dataValues, roleInfo: roleInfo[0].dataValues, token },
                message: "登陆成功！",
                code: 200,
            };
        } else {
            return this.ctx.body = {
                message: "登陆账号或密码错误！",
                code: 200,
            }
        }
    } catch (error) {
        return error.message;
    }
}
// 退出登录
async logOut() {
    const { ctx } = this
    try {
        const token = ctx.cookies.get('token', {
            maxAge: -1,
        });
        if (!ctx.session.data && !token) {
            return ctx.body={'已经登录'}
        }
        if (token) {
            ctx.cookies.set('token', '')
        }
        ctx.session.data = null;
        return ctx.body={'退出登录'}
    } catch (error) {
        return error.message
    }
}

2.vue代码

<script>
// npm i vue-cookie -S
import Cookies from 'vue-cookie'
export default {
  name: "App",
  data() {
    return {
    };
  },
  mounted() {
    window.onload = function() {
      if (!window.sessionStorage["ISlogin"]) {
        Cookies.delete("token");
        Cookies.delete("token.sig");
        Cookies.delete("EGG_SESS");
        location.reload(); //不能省，强制跳到登陆页
      } else {
        window.sessionStorage.removeItem("ISlogin");
      }
    };
    window.onunload = function() {
      window.sessionStorage["ISlogin"] = true;
    };
    window.onbeforeunload = function() {
      window.sessionStorage["ISlogin"] = true;
    };
  },
};
</script>

---

过程

以上代码为egg的实现，其实登录都可以了，但是在浏览器测试登录的时候，有一个问题就是退出登录之后cookie还是存在的，应该在首页的，可是打开项目还是在登录页，于是乎，那就想关闭标签或者关闭浏览器清除cookie ，那就在APP.vue中加入以下代码。