• 抖音实战~关注博主

    在这里插入图片描述
    在这里插入图片描述

    文章目录

    一、关注我需求分析
    1. 关注我流程图

    在这里插入图片描述

    2. 关注我流程简述
    • 1.短视频页面点击关注
    • 2.前端携带用户ID和短视频发布者ID请求后端
    • 3.参数校验用户ID和短视频发布者ID是否为空
      • 3.1. 为空，直接返回前端提示语
      • 3.2.不为空，流程继续
    • 4.携带用户ID查询数据库
    • 5.携带短视频发布者ID查询数据库
    • 6.双ID判断
      • 6.1. 为空，直接返回前端提示语
      • 6.2.不为空，流程继续
    • 7.判断对方是否关注我
    • 7.1. 未关注我，互为朋友关系状态位0
    • 7.2. 已关注我，互为朋友关系状态位1
      • 7.2.1.更新博主与我的粉丝关系状态为1
      • 7.2.2.保存落库
    • 8.保存我和博主的粉丝关系
    • 9.我的关注总数+1
    • 10.博主的粉丝总数
    • 11.我和博主的关联关系=1
    • 12.返回响应
    3. 表结构设计
    CREATE TABLE `fans` (
  `id` varchar(24) NOT NULL,
  `vloger_id` varchar(24) NOT NULL COMMENT '作家用户id',
  `fan_id` varchar(24) NOT NULL COMMENT '粉丝用户id',
  `is_fan_friend_of_mine` int(1) NOT NULL COMMENT '粉丝是否是vloger的朋友，如果成为朋友，则本表的双方此字段都需要设置为1，如果有一人取关，则两边都需要设置为0',
  PRIMARY KEY (`id`) USING BTREE,
  UNIQUE KEY `writer_id` (`vloger_id`,`fan_id`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='粉丝表\n\n';

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    二、关注我源码分析

    短视频页面关注后，个人中心关注状态同步修改

    2.1. 前端
    	// 关注我
			followMe() {
				var me = this;
				var myUserInfo = getApp().getUserInfoSession();
				if (myUserInfo == null) {
					uni.showToast({
						duration: 3000,
						title: "请登录~",
						icon: "none"
					});

					uni.navigateTo({
						url: "../loginRegist/loginRegist",
						animationType: "slide-in-bottom",
						success() {
							me.loginWords = "请登录"
						}
					});

					return;
				}

				var vlogerId = me.userPageId;
				var userId = getApp().getUserInfoSession().id;
				var serverUrl = app.globalData.serverUrl;
				uni.request({
					method: "POST",
					header: {
						headerUserId: userId,
						headerUserToken: app.getUserSessionToken()
					},
					url: serverUrl + "/fans/follow?myId=" + userId + "&vlogerId=" + vlogerId,
					success(result) {

						if (result.data.status == 200) {
							me.isFollow = true;
							uni.setStorageSync("justFollowVlogerId", vlogerId);

							// 刷新当前页的粉丝数
							var pendingInfo = me.pageUserInfo;
							me.pageUserInfo.myFansCounts = pendingInfo.myFansCounts + 1;
						} else {
							uni.showToast({
								title: result.data.msg,
								icon: "none",
								duration: 3000
							});
						}

					}
				});

			},

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    2.2. 后端

    controller

      /**
     * 关注
     *
     * @param myId     我的用户ID
     * @param vlogerId 视频发布者ID
     * @return
     */
    @PostMapping("follow")
    public GraceJSONResult follow(@RequestParam String myId,
                                  @RequestParam String vlogerId) {

        // 判断两个id不能为空
        if (StringUtils.isBlank(myId) || StringUtils.isBlank(vlogerId)) {
            return GraceJSONResult.errorCustom(ResponseStatusEnum.SYSTEM_ERROR);
        }

        // 判断当前用户，自己不能关注自己
        if (myId.equalsIgnoreCase(vlogerId)) {
            return GraceJSONResult.errorCustom(ResponseStatusEnum.SYSTEM_RESPONSE_NO_INFO);
        }

        // 判断两个id对应的用户是否存在
        Users vloger = userService.getUser(vlogerId);
        Users myInfo = userService.getUser(myId);

        // fixme: 两个用户id的数据库查询后的判断，是分开好？还是合并判断好？
        if (myInfo == null || vloger == null) {
            return GraceJSONResult.errorCustom(ResponseStatusEnum.SYSTEM_RESPONSE_NO_INFO);
        }

        // 保存粉丝关系到数据库
        fansService.doFollow(myId, vlogerId);

        // 博主的粉丝+1，我的关注+1
        //我的关注总数
        redis.increment(REDIS_MY_FOLLOWS_COUNTS + ":" + myId, 1);
        // 博主的粉丝总数
        redis.increment(REDIS_MY_FANS_COUNTS + ":" + vlogerId, 1);

        // 我和博主的关联关系，依赖redis，不要存储数据库，避免db的性能瓶颈
        redis.set(REDIS_FANS_AND_VLOGGER_RELATIONSHIP + ":" + myId + ":" + vlogerId, "1");

        return GraceJSONResult.ok();
    }

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
     /**
     * 关注
     *
     * @param myId     我的ID
     * @param vlogerId 视频博主ID
     */
    @Transactional
    @Override
    public void doFollow(String myId, String vlogerId) {

        String fid = sid.nextShort();

        Fans fans = new Fans();
        fans.setId(fid);
        fans.setFanId(myId);
        fans.setVlogerId(vlogerId);

        // 判断对方是否关注我，如果关注我，那么双方都要互为朋友关系
        //TODO 这里的参数注意 判断对方是否关注我，如果关注我，那么双方都要互为朋友关系
        Fans vloger = queryFansRelationship(vlogerId, myId);
        if (vloger != null) {
            fans.setIsFanFriendOfMine(YesOrNo.YES.type);

            // 粉丝是否是vloger的朋友，如果成为朋友，则本表的双方此字段都需要设置为1，如果有一人取关，则两边都需要设置为0
            vloger.setIsFanFriendOfMine(YesOrNo.YES.type);
            fansMapper.updateByPrimaryKeySelective(vloger);
        } else {
            //粉丝是否是vloger的朋友，如果成为朋友，则本表的双方此字段都需要设置为1，如果有一人取关，则两边都需要设置为0
            fans.setIsFanFriendOfMine(YesOrNo.NO.type);
        }

        fansMapper.insert(fans);


        // 系统消息：关注
        msgService.createMsg(myId, vlogerId, MessageEnum.FOLLOW_YOU.type, null);
    }

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
     /**
     * 判断对方是否关注我，如果关注我，那么双方都要互为朋友关系
     *
     * @param fanId    粉丝ID
     * @param vlogerId 短视频发布ID
     * @return
     */
    public Fans queryFansRelationship(String fanId, String vlogerId) {
        Example example = new Example(Fans.class);
        Example.Criteria criteria = example.createCriteria();
        criteria.andEqualTo("vlogerId", vlogerId);
        criteria.andEqualTo("fanId", fanId);

        List list = fansMapper.selectByExample(example);

        Fans fan = null;
        if (list != null && list.size() > 0 && !list.isEmpty()) {
            fan = (Fans) list.get(0);
        }

        return fan;
    }

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    三、账号1关注实战
    3.1. 关注前数据记录

    找二个没有关注的账号进行测试

    账号：尾号~5217
    昵称：昕泽之源
    关注总量：2
    粉丝数：1

    在这里插入图片描述
    账号：尾号~0009
    昵称：小美女
    关注总量：0
    粉丝数：1

    在这里插入图片描述
    2个账号关系~二人暂无关注

    3.2. 账号1关注账号2
    • 使用“尾号为5217”账号登录
      在这里插入图片描述

    查看首页由尾号为0009的小美女账号发布短视频
    在这里插入图片描述
    点击关注
    在这里插入图片描述

    3.3. 账号1关注后数据变化

    尾号~5217关注 尾号~0009的账户后，数据变化

    尾号~5217数据变化
    关注总量：由2变成了3
    粉丝数：1

    尾号~0009数据变化
    关注总量：没变 还是 0
    粉丝数：由1变成了2

    表数据变化：
    用户表
    尾号~0009 userid=21100598TZ9XG6RP
    尾号~5217 userid=220620BZ2DH0KP94
    在这里插入图片描述
    粉丝表
    新增一条数据，视频博主（21100598TZ9XG6RP）粉丝中有我（220620BZ2DH0KP94）

    2206279H48HX0T54	21100598TZ9XG6RP	220620BZ2DH0KP94	0

    • 1

    在这里插入图片描述

    四、. 账号2关注实战
    4.1. 账号2关注账号1

    使用尾号~0009账户登录
    在这里插入图片描述

    去首页~视频列表中，查看是否关注的状态为-未关注
    在这里插入图片描述
    点击关注
    关注状态为-已关注
    在这里插入图片描述
    在这里插入图片描述

    4.2. 关注后数据变化

    尾号~0009关注 尾号~5217的账户后，数据变化

    尾号~5217数据变化
    关注总量：3
    粉丝数：由1变成了2

    尾号~0009数据变化
    关注总量：由 变成了1
    粉丝数：还是2

    表数据变化：
    用户表
    尾号~0009 userid=21100598TZ9XG6RP
    尾号~5217 userid=220620BZ2DH0KP94
    粉丝表
    新增一条数据，
    我（220620BZ2DH0KP94）的粉丝中有尾号0009（21100598TZ9XG6RP）
    视频博主（21100598TZ9XG6RP）粉丝中有我（220620BZ2DH0KP94）
    并且我们的关系更新为朋友关系，状态都为0

    2206279P5FYBZYNC	220620BZ2DH0KP94	21100598TZ9XG6RP	1
2206279H48HX0T54	21100598TZ9XG6RP	220620BZ2DH0KP94	1

    • 1
    • 2

    在这里插入图片描述

    4.3. redis存储数据结构

    在这里插入图片描述

  • 相关阅读:
    [PAT-Advanced] A1054. The Dominant Color (20)
    从零开始写 Docker(十六)---容器网络实现(上)：为容器插上”网线”
    Trie字典树
    基于多目标两阶段随机规划方法的电热联合系统调度
    手办信息系统
    数据分享|Python卷积神经网络CNN身份识别图像处理在疫情防控下口罩识别、人脸识别
    go语言数组、切片和指针
    java计算机毕业设计高校教师教学业绩考核系统2021源码+mysql数据库+系统+lw文档+部署
    山景BP10_128DEG开发板开发踩坑记录1
    Sylar C++高性能服务器学习记录05 【线程模块-知识储备篇】
  • 原文地址：https://blog.csdn.net/weixin_40816738/article/details/125481889