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

news2024/9/23 21:25:45

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. 展示用户信息

<template>
  <template v-if="user">
    <van-cell title="昵称" is-link :value="user.username" @click="toEdit('username', '昵称',user.username)"/>
    <van-cell title="账户" :value="user.userAccount"/>
    <van-cell title="头像" :value="user.avatarUrl" @click="toEdit('avatarUrl', '头像',user.avatarUrl)">
      <img :src="user.avatarUrl"/>
    </van-cell>
    <van-cell title="性别" is-link :value="user.gender" @click="toEdit('gender', '性别',user.gender)"/>
    <van-cell title="手机号" is-link :value="user.phone" @click="toEdit('phone', '手机号',user.phone)"/>
    <van-cell title="邮箱" is-link :value="user.email" @click="toEdit('email', '邮箱',user.email)"/>
    <van-cell title="星球编号" :value="user.planetCode" />
    <van-cell title="标签信息" is-link :value="user.tags" @click="toEdit('tags', '标签信息',user.tags)" />
    <van-cell title="注册时间" :value="user.createTime" />
  </template>
</template>

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);
    }

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1397838.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

进入docker容器,vi: command not found

问题描述&#xff1a; 进入docker容器&#xff0c;查看文件执行vim 命令&#xff0c;报错 vim: command not found。搜索解决方案&#xff0c;说执行一下 apt-get install vim命令&#xff0c;然后又报错 Unable to locate package vim。 解决&#xff1a; 1.执行 npt-get up…

亚马逊云科技 WAF 部署小指南(六)追踪 Amazon WAF Request ID,排查误杀原因

众所周知&#xff0c;中国是全球制造业的巨大力量&#xff0c;许多中国企业通过 2B 电商平台网站进行商品销售和采购。在这些电商平台上&#xff0c;Web 应用防火墙&#xff08;WAF&#xff09;成为不可或缺的安全工具。然而&#xff0c;WAF 也可能导致误杀问题。一旦误杀发生&…

Deep MultimodalLearningA survey on recent advances and trends

深度多模态学习&#xff1a;对近期进展和趋势的综述 深度学习的成功已经成为解决越来越复杂的机器学习问题的催化剂&#xff0c;这些问题通常涉及多个数据模态。我们回顾了深度多模态学习的最新进展&#xff0c;并突出了该活跃研究领域的现状&#xff0c;以及存在的差距和挑战…

Java中打印图案最常用的25个图案程序

Java是公认的最流行的编程语言&#xff0c;因为它的简单性和多功能性。还可以使用它开发各种应用程序&#xff0c;包括Web、移动和桌面应用程序。此外&#xff0c;Java为开发人员提供了强大的工具来轻松高效地创建复杂的程序。Java最有前途的特性之一是它能够创建可以以特定格式…

爬虫-selenium自动化(3)-验证码

#验证码分很多种&#xff0c;奇葩也无处不在:哪个是真茅台&#xff0c;红绿灯&#xff0c;摩托车......(我是个人都看不出来) (๑﹏๑) #本节内容为selenium自动化实现验证码通过-------字符验证码&#xff0c;点触验证码。 验证码介绍 字符验证码案例 点触验证码案例

[Python] scikit-learn之mean_squared_error函数(Mean Squared Error(MSE))介绍和使用案例

什么是均方误差(MSE)和均方根误差(RMSE)? MSE 是均方误差(Mean Squared Error)的缩写&#xff0c;是一种常用的衡量回归模型预测精度的指标。它表示预测值与真实值之间差异的平方和的平均值&#xff0c;通常用于评估回归模型的性能。 RMSE 是均方根误差(Root Mean Squared Er…

C#,字符串匹配(模式搜索)有限自动机(Finite Automata)算法的源代码

一、有限状态自动机 图中两个圆圈&#xff0c;也叫节点&#xff0c;用于表示状态&#xff0c;从图中可以看成&#xff0c;它有两个状态&#xff0c;分别叫0和1。从每个节点出发&#xff0c;都会有若干条边。当处于某个状态时&#xff0c;如果输入的字符跟该节点出发的某条边的内…

tomcat与servlet

目录 一、Http服务器 二、tomcat 1、概念 2、tomcat解压缩文件 &#xff08;1&#xff09;bin文件夹 &#xff08;2&#xff09;conf文件夹 &#xff08;3&#xff09;logs &#xff08;4&#xff09;webapps 3、借助tomcat服务器访问网页 三、servlet 1、概念 2、s…

阿里云有哪些优势?为什么选择阿里云?

为什么选择阿里云&#xff1f;阿里云服务器有哪些优势&#xff1f;阿里云全球第三&#xff0c;国内第一云&#xff0c;阿里云服务器网aliyunfuwuqi.com分享云服务器ECS在丰富ECS实例架构、弹性灵活、稳定可靠、便捷易用、安全保障和成本优化多方面优势&#xff1a; 阿里云服务…

【Linux】磁盘结构 | 文件系统 | 软硬链接

文件的状态有被打开和没有被打开&#xff0c;之前谈到一个文件被进行读写&#xff0c;就要打开加载到内存中&#xff0c;通过对应的系统调用&#xff0c;fd文件描述符的管理&#xff0c;write和read等函数的增删查改。并且借助缓冲区对文件属性和内容的修改。 大部分文件是没有…

高级架构师是如何设计一个系统的?

架构师如何设计系统&#xff1f; 系统拆分 通过DDD领域模型&#xff0c;对服务进行拆分&#xff0c;将一个系统拆分为多个子系统&#xff0c;做成SpringCloud的微服务。微服务设计时要尽可能做到少扇出&#xff0c;多扇入&#xff0c;根据服务器的承载&#xff0c;进行客户端负…

HFSS实战(一)——仿真PCB微带线的损耗

文章目录 一、ODB文件的导出二、PCB文件导入2.1 pcb文件导入2.2层叠设置 三、模型的裁剪四、模型的简化五、端口设置六、将3D LAYOUT模型导出成HFSS模型七、HFSS仿真结束 主要学习目标&#xff1a;利用HFSS3D layout 完成微带线的电磁仿真 利用一个简单的仿真&#xff0c;完成…

项目实战————苍穹外卖(DAY11)

苍穹外卖-day11 课程内容 Apache ECharts 营业额统计 用户统计 订单统计 销量排名Top10 功能实现&#xff1a;数据统计 数据统计效果图&#xff1a; 1. Apache ECharts 1.1 介绍 Apache ECharts 是一款基于 Javascript 的数据可视化图表库&#xff0c;提供直观&#x…

2023.1.19 关于 Redis 事务详解

目录 Redis 事务对比 MySQL 事务 MySQL 事务 Redis 事务 Redis 事务原子性解释 Redis 事务详解 执行流程 典型使用场景 Redis 事务命令 WATCH 的使用 WATCH 实现原理 总结 阅读下文之前建议点击下方链接了解 MySQL 事务详解 MySQL 事务详解 Redis 事务对比 MySQL 事…

探索设计模式的魅力:一篇文章让你彻底搞懂建造者模式

建造者模式&#xff08;Builder Pattern&#xff09;是一种创建型设计模式&#xff0c;旨在将一个复杂对象的创建过程与其表示分离&#xff0c;使得同样的构建过程可以创建不同的表示形式。 主要角色&#xff1a; 产品&#xff08;Product&#xff09;&#xff1a;表示正在构建…

小程序系列--9.生命周期

1. 什么是生命周期&#xff1f; 2. 生命周期的分类 3. 什么是生命周期函数 4. 生命周期函数的分类 5. 应用的生命周期函数 6. 页面的生命周期函数

SpringCloud Aliba-Sentinel【中篇】-从入门到学废【5】

目录 1.流控规则 2. 熔断规则 3.热点规则 1.流控规则 1.资源名&#xff1a;唯一名称&#xff0c;默认请求路径 2.针对来源: Sentinel可以针对调用者进行限流,填写微服务名,默认default (不区分来源) 3.阈值类型/单机阈值&#xff1a; QPS&#xff08;每秒钟的请求数量&…

pytorch学习(一)线性模型

文章目录 线性模型pytorch使用sklearn训练 pytorch是一个基础的python的科学计算库&#xff0c;它有以下特点&#xff1a; 类似于numpy&#xff0c;但是它可以使用GPU可以用它来定义深度学习模型&#xff0c;可以灵活的进行深度学习模型的训练和使用 线性模型 线性模型的基本形…

Studio One2024免费版下载及入门教程分享

众所周知&#xff0c;Studio One是一个专业的音频编辑软件&#xff0c;近几年随着音视频剪辑越来越火&#xff0c;Studio One也逐渐被人们所熟知。最近&#xff0c;就有许多小伙伴私信我&#xff0c;寻求Studio One的入门教程。 这不&#xff0c;今天小编就给大家带来了音频剪…

iphone5s基带部分电源部分主主电源供电及

时序: 1.,基带电源的供电&#xff0c;基带电源也叫pmu。 首先时序图说电池提供供电&#xff0c;电池是J6接口&#xff0c;视频习惯把接口称之为座子。查U2_RF芯片&#xff0c;发现供电信号为PP_BATT_VCC_CONN&#xff0c;但是没查到跟电池座子有关系&#xff0c;电池座子写的是…