4.16关注、取消关注

1.还是开发RedisKeyUtil

 private static final String PREFIX_FOLLOWEE = "followee";//关注的目标
    private static final String PREFIX_FOLLOWER = "follower";//
// 某个用户关注的实体
// followee:userId:entityType -> zset(entityId,now)  zset根据时间排序
public static String getFolloweeKey(int userId, int entityType) {//userId表示谁关注了，entityType表示关注的是哪个实体
    return PREFIX_FOLLOWEE + SPLIT + userId + SPLIT + entityType;
}

// 某个实体拥有的粉丝
// follower:entityType:entityId -> zset(userId,now) zset根据时间排序
public static String getFollowerKey(int entityType, int entityId) {
    return PREFIX_FOLLOWER + SPLIT + entityType + SPLIT + entityId;
}

2.新建FollowService

//关注 功能
public void follow(int userId, int entityType, int entityId) {
    redisTemplate.execute(new SessionCallback() {
        @Override
        public Object execute(RedisOperations operations) throws DataAccessException {
            String followeeKey = RedisKeyUtil.getFolloweeKey(userId, entityType);
            String followerKey = RedisKeyUtil.getFollowerKey(entityType, entityId);

            operations.multi();//开启事务

            operations.opsForZSet().add(followeeKey, entityId, System.currentTimeMillis());//opsForZSet() 有序集合，关注的目标里存着实体id
            operations.opsForZSet().add(followerKey, userId, System.currentTimeMillis());//粉丝里存着用户id

            return operations.exec();
        }
    });
}
//取消关注 功能
public void unfollow(int userId, int entityType, int entityId) {
    redisTemplate.execute(new SessionCallback() {
        @Override
        public Object execute(RedisOperations operations) throws DataAccessException {
            String followeeKey = RedisKeyUtil.getFolloweeKey(userId, entityType);
            String followerKey = RedisKeyUtil.getFollowerKey(entityType, entityId);

            operations.multi();//开启事务

            operations.opsForZSet().remove(followeeKey, entityId);//与add相比，不需要分数System.currentTimeMillis()
            operations.opsForZSet().remove(followerKey, userId);

            return operations.exec();
        }
    });
}

3.视图层

新建FollowController

异步请求，关注以后整个页面只有局部刷新

 //关注
@RequestMapping(path = "/follow", method = RequestMethod.POST)//请求方式是post，因为是提交数据
@ResponseBody//因为是异步，所以添加@ResponseBody
public String follow(int entityType, int entityId) {
    User user = hostHolder.getUser();

    followService.follow(user.getId(), entityType, entityId);

    return CommunityUtil.getJSONString(0, "已关注!");//因为是异步请求，所以返回JSON格式数据
}

//取消关注
@RequestMapping(path = "/unfollow", method = RequestMethod.POST)
@ResponseBody
public String unfollow(int entityType, int entityId) {
    User user = hostHolder.getUser();

    followService.unfollow(user.getId(), entityType, entityId);

    return CommunityUtil.getJSONString(0, "已取消关注!");
}

打开 个人主页 profile.html

关注按钮的逻辑是定义在profile.js里的。

$(function(){
	$(".follow-btn").click(follow);//关注按钮，单击事件click 调用follow方法
});

function follow() {
	var btn = this;//获取当前按钮
	if($(btn).hasClass("btn-info")) {//btn-info表示蓝色样式
		// 关注TA
		$.post(
		    CONTEXT_PATH + "/follow",
		    {"entityType":3,"entityId":$(btn).prev().val()},//entityId得从profile中获取，profile.html里面的84行。$(btn).prev()表示按钮的前一个节点的值.val()
		    function(data) {
		        data = $.parseJSON(data);//将其转为js对象
		        if(data.code == 0) {
                    window.location.reload();//刷新页面
		        } else {
                    alert(data.msg);//打印提示信息
		        }
		    }
		);
		// $(btn).text("已关注").removeClass("btn-info").addClass("btn-secondary");
	} else {
		// 取消关注
		$.post(
		    CONTEXT_PATH + "/unfollow",
		    {"entityType":3,"entityId":$(btn).prev().val()},//entityType为3 表示是针对人的
		    function(data) {
		        data = $.parseJSON(data);
		        if(data.code == 0) {
                    window.location.reload();
		        } else {
                    alert(data.msg);
		        }
		    }
		);
		//$(btn).text("关注TA").removeClass("btn-secondary").addClass("btn-info");
	}
}

测试：
启动项目
点击关注

点完以后没反应，
但库中可以查到，所以是显示的问题

主要修改 关注数量和状态：

在FollowService添加：

// 查询关注的实体的数量
public long findFolloweeCount(int userId, int entityType) {//谁的关注目标，某一类的目标（关注多少用户，关注多少帖子要分开统计），
    String followeeKey = RedisKeyUtil.getFolloweeKey(userId, entityType);
    return redisTemplate.opsForZSet().zCard(followeeKey);//统计数量方法zCard
}
    // 查询实体的粉丝的数量
    public long findFollowerCount(int entityType, int entityId) {
        String followerKey = RedisKeyUtil.getFollowerKey(entityType, entityId);
        return redisTemplate.opsForZSet().zCard(followerKey);
    }

在主页上显示正确的 数量和状态

主页通过user contronller访问
因此添加如下：

// 关注数量
long followeeCount = followService.findFolloweeCount(userId, ENTITY_TYPE_USER);
model.addAttribute("followeeCount", followeeCount);
// 粉丝数量
long followerCount = followService.findFollowerCount(ENTITY_TYPE_USER, userId);
model.addAttribute("followerCount", followerCount);
// 是否已关注 当前登录用户 对该用户关注
boolean hasFollowed = false;
if (hostHolder.getUser() != null) {
    hasFollowed = followService.hasFollowed(hostHolder.getUser().getId(), ENTITY_TYPE_USER, userId);
}
model.addAttribute("hasFollowed", hasFollowed);

return "/site/profile";

然后打开profile.html

测试：

但是再点一下，没有取消关注
修改 profile.html 85行

<input type="hidden" id="entityId" th:value="${user.id}"><!-- button之前的隐藏框，从框里取出id -->   <!--这是下一行的注释   未关注则btn显示btn-info ，关注则显示btn-secondary， -->
					<button type="button" th:class="|btn ${hasFollowed?'btn-secondary':'btn-info'} btn-sm float-right mr-5 follow-btn|"

再次测试：

已关注则变灰

再次点击则变篮

且关注者变为0

个人主页也正确，之前点了关注一个人的