抖音實戰~關注博主

一、關注我需求分析

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';

二、關注我源碼分析

短視頻頁面關注後，個人中心關注狀態同步修改

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

					}
				});

			},

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

 /**
     * 關注
     *
     * @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);
    }

 /**
     * 判斷對方是否關注我，如果關注我，那麼雙方都要互為朋友關系
     *
     * @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關注實戰

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

四、. 賬號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

4.3. redis存儲數據結構