【金秋打卡】第14天 egg.js 设置对应cookie 和 egg-session 实现用户认证

课程名称：web前端架构师
课程章节：第16周 第四章 使用 egg-session 实现用户认证
主讲老师：张轩
课程内容： egg.js 设置对应的 cookie

egg.js 设置对应cookie

egg.js. 使用 cookie 对应 的cookie

使用方法

设置 cookie

ctx.cookies.set(key, value, options)

option

• {Number} maxAge: 设置这个键值对在浏览器的最长保存时间。是一个从服务器当前时刻开始的毫秒数。
  {Date} expires: 设置这个键值对的失效时间，如果设置了 maxAge，expires 将会被覆盖。如果 maxAge 和 expires 都没设置，Cookie 将会在浏览器的会话失效（一般是关闭浏览器时）的时候失效。

• {String} path: 设置键值对生效的 URL 路径，默认设置在根路径上（/），也就是当前域名下的所有 URL 都可以访问这个 Cookie。

• {String} domain: 设置键值对生效的域名，默认没有配置，可以配置成只在指定域名才能访问。

• {Boolean} httpOnly: 设置键值对是否可以被 js 访问，默认为 true，不允许被 js 访问。

• {Boolean} secure: 设置键值对只在 HTTPS 连接上传输，框架会帮我们判断当前是否在 HTTPS 连接上自动设置 secure 的值。

除了这些属性之外，框架另外扩展了 3 个参数的支持：

• {Boolean} overwrite：设置 key 相同的键值对如何处理，如果设置为 true，则后设置的值会覆盖前面设置的，否则将会发送两个 set-cookie 响应头。
• {Boolean} signed：设置是否对 Cookie 进行签名，如果设置为 true，则设置键值对的时候会同时对这个键值对的值进行签名，后面取的时候做校验，可以防止前端对这个值进行篡改。默认为 true。
• {Boolean} encrypt：设置是否对 Cookie 进行加密，如果设置为 true，则在发送 Cookie 前会对这个键值对的值进行加密，客户端无法读取到 Cookie 的明文值。默认为 false。

获取 cookie

ctx.cookies.get(key, options)

使用cookie 完成用户登录

public async signin() {
  ...
  const { username, password } = ctx.request.body;
  const user = (await service.user.findByUsername(username));
  ...
  // 设置 cookie
  ctx.cookies.set('user', JSON.stringify(user.toJSON()));
  ctx.helper.success({
    ctx,
    res: user.toJSON(),
    msg: '登录成功',
  });
}
public async getUser() {
  const { ctx } = this;
  // 获取 cookie
  const user = ctx.cookies.get('user');
  ctx.helper.success({
    ctx,
    res: user,
    msg: '获取用户信息成功',
  });
}

这样就实现了用户登录的保存和获取

我们发现设置完cookie 后，浏览器会携带两个cookie

• user 就是我们保存在用户信息
• user.sig 用来确保 cookie user 没有被篡改，篡改后就不会获取到用户的信息

如若我们不想在浏览器让用户看到保存的信息，可以将第二个参数的encrypt 设置为 true， 加密的key 是在 config 文件中进行配置

// config.default.ts 默认就是生成这个 key
config.keys = appInfo.name + '_1667401289129_8694';

设置加密的 cookie

ctx.cookies.set('user', JSON.stringify(user.toJSON()), {
  encrypt: true,
});

获取的时候也需要设置 encrypt

const user = ctx.cookies.get('user', {
  encrypt: true,
});

使用 egg-session 完成用户认证

egg.js 内置了 egg-session 插件

在 plugin.js 文件中开启 session

const plugin: EggPlugin = {
  ...
  session: true,
};

使用 egg-session

添加 session

class HomeController extends Controller {
  async fetchPosts() {
    const ctx = this.ctx;
    // 获取 Session 上的内容
    const userId = ctx.session.userId;
    const posts = await ctx.service.post.fetch(userId);
    // 修改 Session 的值
    ctx.session.visited = ctx.session.visited ? ctx.session.visited + 1 : 1;
    ctx.body = {
      success: true,
      posts,
    };
  }
}

修改 session 直接给它赋值就可以了，删除 session 直接给它赋值为 null 就可以了

ctx.session = null;

Session 的实现是基于 Cookie 的，默认配置下，用户 Session 的内容加密后直接存储在 Cookie 中的一个字段中，用户每次请求我们网站的时候都会带上这个 Cookie，我们在服务端解密后使用。Session 的默认配置如下：

session = {
  key: 'EGG_SESS',
  maxAge: 24 * 3600 * 1000, // 1 天
  httpOnly: true,
  encrypt: true,
};

使用 egg-session 完成用户登录

public async signin() {
  const { ctx, service, app } = this;
  ...
  const user = (await service.user.findByUsername(username));
  // 设置 session
  ctx.session.user = user;
  ctx.helper.success({
    ctx,
    res: user.toJSON(),
    msg: '登录成功',
  });
}

public async getUser() {
  const { ctx } = this;
  // 获取 session
  const user = ctx.session.user;
  ctx.helper.success({
    ctx,
    res: user,
    msg: '获取用户信息成功',
  });
}

egg-session 中对 session 的保存并没有存放到内存中，如果放在内存中，我们重启服务后，获取用户信息就获取不到，但是使用 egg-session 重启服务后仍然可以获取到用户信息。