论坛开发碎碎念集合

2.6k 词

写于2023暑假雅安实习10天,尝试做全栈的论坛,代码很捞,还是学了点东西

点赞(7.14)

点赞在数据库中以表格形式存在

  • bid:博客id
  • uid:账户id
    二者组成表的主键,且各自作为外键

点赞相关数据库操作

  • 查询指定bid的点赞数目
  • 添加新的点赞
  • 取消之前的点赞

点赞的前端展示

  • 点赞数目将控制文字点赞人数的显示
  • 用户是否点赞将决定文末点赞按钮(来源于查询附带的结果)
    • 图标样式将改变
    • button的函数不同

等级成长(7.14)

用户含有两个属性,经验与等级

  • 每发一次博客即经验+2
  • 每次经验改变,将可能使得等级发生改变

实现方式 触发器

  • 触发器1
    • 触发条件:after insert blog(发表博客时)
    • 触发行为:对每一个row,更新user表的exper,使其+2
  • 触发器2
    • 触发条件:after update user
    • 触发行为:对每一个row,更新NEW.grade = user/10
    • 曾出现的报错,见博客 触发器

触发器出现的问题

Can’t update table ‘user’ in stored function/trigger because it is already used by statement which invoked this stored function/trigger.

  • 根本原因在于触发自己的是user表,操作的时候update user表,导致错误
  • 采用NEW代替update操作即可

触发器基础写法

  • 首先改变DELIMMTER
  • 创建trigger
  • 指定触发条件,after/before,操作,表格
  • Begin书写触发内容End
  • 改回DELIMMTER

上午(7.15)

修改背景图片

利用视频(.mp4)将背景修改为动态背景

  • 对于有overflow的页面,将height设置为auto
  • 对于没有overflow的页面,将height设为100vh

添加修改模块

  • 使用路由传参,从特定博客转至创作中心

下午(7.15)

将保持登陆的方法更改

  • 之前使用的是Vue.prototype挂属性
  • 为保证会话持续期间一直保持登录,改用sessionSetItem记录数据,实现刷新不掉线

修改后端所有更改数据的sql语句

  • insert:由于insert没有where用法,使用select作条件,并判断修改的行数作为是否成功的依据
  • delete:添加条件判断密码是否正确
  • update:添加条件判断密码是否正确

被分页查询的分页条干碎了

上午(7.16)

删除触发器

由于昨日insert改为select辅助判断条件,使用了user表导致触发器无法正常工作(更新user对应的exper+2),所以删除了这个触发器,并将该任务交给了事务,当修改成功一行时,将更新经验

分页查询

  • 对于博客浏览页,设置了两种分页查询
    • 条件分页查询
    • 无条件分页查询
  • 主要麻烦在于两种查询相互转换的时候,选择接口(无条件查询选择全部查询的接口,条件不为空时选择条件查询)
    • 为此设置了状态量constate,用以判断使用何种接口
  • 对于个人空间,也同样设置了一个无条件分页查询
  • 这次尝试的主要难点在于调整el-pagination激活的页码

下午及晚上(7.16)

完善评论功能

  • 添加删除键,可删除自己的评论
  • 添加评论回复功能,为这个功能做了很多工作
    • 修改查询方式,将其改为两表左连接,有父级评论的评论将附带父级信息传递
    • 修改前端渲染方式,有父级评论的评论将在其div内部展现灰色div,含有父级评论信息

上午(7.17)

完善个人空间页面

  • 添加博客发表数
  • 添加获得点赞数
  • 添加点赞数

完善评论展示

  • 调整按钮布局,并将删除按钮有条件的隐藏起来
  • 自定义左右移动页,进行了简单的分页查询自定义
    • 之前分页查询使用了el-pagination,较为容易
    • 当自定义分页时,各种属性需要靠自己去计算,所以调整了很久

在服务器上完成部署

中午(7.17)

完善加载界面,引入loading动画

修改了部分健壮性逻辑

将父级评论删除后,评论的处理

修改了sql语句与前端渲染的方式,使得评论a回复评论b时,若b被删除,则将表示在网页上

修改早上写的bug,比如限制字数却成功发表

上午(7.18)

完成了图片上传的功能

  • 创建了新的接口负责上传的对象的存储
  • 修改了配套的sql语句
    • 存储将指定文件夹的路径存储在数据库中
    • 获取用户相关信息时,将该路径返回给用户
  • 但是头像全写成avater了),不想改了

下午(7.18)

头像排版问题

上午(7.19)

在熟悉md插件的基础上,尝试处理文件

  • 利用java语言为每个图片建立路径,并将上传的图片保存
  • 利用md的图片url,将指定路径的图片渲染出来

下午晚上(7.19)

基础的评论消息会被临时存储在一张表上,相关用户登录时会得到消息提示

总结

学会在利用element-ui的基础上,调整css,实现简单动态的页面布局

学会分页查询的基本思路及原理

集中表现为:limit,offset,current_page和maxpage直接的计算关系与请求、渲染方式

逐渐理解数据库理论课上各连接的出现意义及应用场景:

  • 我以前一直不理解左右连接到底是干啥的
  • 在评论分页中,由于回复评论必须跨页显示出来,所以此处我用了左连接
    左侧是评论主体,右侧是可能出现的评论,连接条件是左侧的fpid(父级评论id)等于右侧的pid,如果能够匹配说明存在父级评论且未父级评论未被删除,如果不存在父级评论或评论被删除将不存在相应父级信息列(不存在与曾经存在但被删除的区别是fpid是否为0)

利用java处理文件,构建基本的文件服务器,能够实现头像、博客中图片的上传与渲染

接口设计更安全,每一个设计数据库更新的操作都需要uid和密码进行验证

数据库设计更丰富,实现功能更多元

前端函数学习

  • 例如标签tag的设计,需要对得到的字符串进行分隔
  • 例如涉及文件上传的内容,对相关检查函数的编写更了解

在数据库操作上对各类情况更熟练

  • 多表联合查询
  • insert 利用select进行条件判断
  • 触发器的使用(用户经验更新时,等级自动判断更新)

消息提示(遗留问题)

问题

  • 当作者A写了博客blog,并在blog下评论c1
  • 用户B进入blog,并回复c1
  • 此时原有代码将产生两次插入操作,将消息重复插入alert
  • alert设置了主键保证一个用户对同一个博客只能收到一次提示
  • 插入失败,同时死锁
  • 其他涉及数据库更新操作均无法完成

修改

  • 在每次使用insert插入前,先判断是否已有该消息

结果

  • 忘记图像目录和后端代码放在同一个文件夹内,更新代码时将原文件夹覆盖时,忘记了备份图像
  • 原来的图像全丢了!!!!
留言