浪花 - 用户信息展示＋更新

1. 用户登录获取登录凭证

• 已登录的用户才能获取个人信息
• 发送 Aixos 请求登录

const user = ref();

onMounted(async () => {
  const res = await myAxios.get('/user/current');
  if (res.code === 0) {
    console.log("获取用户信息成功");
    user.value = res.data;
  } else {
    console.log("获取用户信息失败")
  }
})

2. 获取登录用户的个人信息

• 点击个人页时加载个人信息

踩坑记录：前端发送请求后端无法识别已登录用户

• 原因：前端发送请求时没有携带登录时后端返回的 Cookie
• 解决：给 Axios 加上携带 Cookie 的配置，表示请求要携带 Cookie

myAxios.defaults.withCredentials = true;

• 携带 Cookie 成功

•  获取当前登录用户信息：后端通过 Cookie 识别到前端的登录态，获取成功✔

 3. 展示用户信息

4. 更新用户信息

前端：

•  点击提交按钮，发送更新用户个人信息请求
• 收到后端更新成功的响应，返回信息展示页面

const onSubmit = async () => {
  const currentUser = await getCurrentUser();
  if (!currentUser) {
    console.log("用户未登录")
    return;
  }
  // 发送更新请求
  const res = await myAxios.post('/user/update', {
    'id': currentUser.id,
    [editUser.value.editKey as string]: editUser.value.currentValue,
  })
  if (res.code === 0 && res.data > 0) {
    router.back();
    console.log("修改成功！");
  } else {
    console.log("修改失败！");
  }
};

后端：

• 校验用户权限，满足权限则执行 UPDATE 语句更新个人信息

• 完善逻辑（校验参数）：前端传来的参数为空时，直接抛出异常，不执行 UPDATE 语句

    /**
     * 更新用户信息
     * @param user 要更新的用户
     * @param loginUser 当前登录用户
     * @return
     */
    @Override
    public int updateUser(User user, User loginUser) {
        long userId = user.getId();
        if (userId <= 0) {
            throw new BusinessException(ErrorCode.PARAMS_ERROR);
        }
        // TODO 如果用户没有传递任何需要更新的值，直接报错，不执行 UPDATE 语句
        if(user == null) {
            throw new BusinessException(ErrorCode.PARAMS_ERROR);
        }
        // 管理员：更新任意用户的信息
        // 普通用户：只允许更新自己的信息
        if (!isAdmin(loginUser) && userId != loginUser.getId()) {
            throw new BusinessException(ErrorCode.NO_AUTH);
        }
        User oldUser = userMapper.selectById(userId);
         if (oldUser == null) {
            throw new BusinessException(ErrorCode.NULL_ERROR);
        }
        return userMapper.updateById(user);
    }