博客系统中,用户浏览文章时可以在文章下方发表自己的观点,与博主或其他用户进行互动,也可以为喜欢的文章点赞。下面我们一起分析一下 Halo 项目中评论和点赞功能的实现过程。
发表评论评论可以是对文章的评论,对页面的评论,也可以是对评论的评论(通常称为回复),因此项目中需要对评论的类别进行划分。评论的实体类 BaseComment 中设置了几个重要的属性:type、postId、parentId。其中 type 用于区分文章和页面,type 为 0 表示对文章的评论,为 1 表示对页面的评论;postId 用于指定评论属于哪一篇文章或页面;parentId 表示当前评论的 "父评论",如果当前评论是对某个 "父评论" 的回复,那么 parentId 为该 "父评论" 的 id,如果评论文章,那么 parentId 为 0。
进入博客首页,点开一篇文章,在下方发表评论:
点击 "评论" 按钮后,触发 api/content/posts/comments
请求:
该请求由 PostController 中的 comment 方法处理:
@PostMapping("comments")
@ApiOperation("Comments a post")
@CacheLock(autoDelete = false, traceRequest = true)
public BaseCommentDTO comment(@RequestBody PostCommentParam postCommentParam) {
// 验证当前 IP 是否处于封禁状态
postCommentService.validateCommentBlackListStatus();
// 对评论的内容进行转义
// Escape content
postCommentParam.setContent(HtmlUtils
.htmlEscape(postCommentParam.getContent(), StandardCharsets.UTF_8.displayName()));
// 创建评论
return postCommentService.convertTo(postCommentService.createBy(postCommentParam));
}
comment 方法首先会检查当前发送评论的 IP 是否处于封禁状态,如果未处于封禁状态,那么系统会对评论的内容进行 HTML 转义,转义完成后创建该评论。首先介绍一下 Halo 的 "封禁评论" 机制,封禁的目的是防止恶意 IP 抢占和浪费博客系统的资源。进入 validateCommentBlackListStatus 方法,查看验证 IP 的具体过程:
public void validateCommentBlackListStatus() {
// 查看当前 IP 的封禁状态
CommentViolationTypeEnum banStatus =
commentBlackListService.commentsBanStatus(ServletUtils.getRequestIp());
// 获取系统设置的封禁时间
Integer banTime = optionService
.getByPropertyOrDefault(CommentProperties.COMMENT_BAN_TIME, Integer.class, 10);
// 如果当前 IP 处于封禁状态, 提示用户稍后重试
if (banStatus == CommentViolationTypeEnum.FREQUENTLY) {
throw new ForbiddenException(String.format("您的评论过于频繁,请%s分钟之后再试。", banTime));
}
}
上述代码中,服务器首先查询当前 IP 的封禁状态,如果状态为 FREQUENTLY,那么就认为当前 IP 的评论过于频繁,然后提示用户稍后重试。该过程是一种 "限流" 机制,其重点在于如何设计 "频繁评论" 的评判标准,直白一点就是如何 "限流"?限流的方式有很多种,如利用缓存或内存队列等。Halo 中使用数据库来实现限流策略,这个设计思路也是非常值得学习的,commentsBanStatus 方法的处理逻辑如下:
public CommentViolationTypeEnum commentsBanStatus(String ipAddress) {
/*
N=后期可配置
1. 获取评论次数;
2. 判断N分钟内,是否超过规定的次数限制,超过后需要每隔N分钟才能再次评论;
3. 如果在时隔N分钟内,还有多次评论,可被认定为恶意攻击者;
4. 对恶意攻击者进行N分钟的封禁;
*/
// 发送评论的 ip 在封禁是否在封禁名单中
Optional<CommentBlackList> blackList =
commentBlackListRepository.findByIpAddress(ipAddress);
LocalDateTime now = LocalDateTime.now();
Date endTime = new Date(DateTimeUtils.toEpochMilli(now));
// 封禁的时间间隔, 也是评估是否需要封禁的时间间隔, 默认 10 分钟
Integer banTime = optionService
.getByPropertyOrDefault(CommentProperties.COMMENT_BAN_TIME, Integer.class, 10);
// now - 时间间隔
Date startTime = new Date(DateTimeUtils.toEpochMilli(now.minusMinutes(banTime)));
// 评论数阈值, 默认为 30 个
Integer range = optionService
.getByPropertyOrDefault(CommentProperties.COMMENT_RANGE, Integer.class, 30);
// 指定时间间隔内, 当前 ip 的评论数是否超过评论数阈值
boolean isPresent =
postCommentRepository.countByIpAndTime(ipAddress, startTime, endTime) >= range;
if (isPresent && blackList.isPresent()) {
// 设置当前 IP 的解禁时间为 banTime 分钟后
update(now, blackList.get(), banTime);
return CommentViolationTypeEnum.FREQUENTLY;
} else if (isPresent) {
// 构建 CommentBlackList 对象, 设置当前 IP 的解禁时间为 banTime 分钟后
CommentBlackList commentBlackList = CommentBlackList
.builder()
.banTime(getBanTime(now, banTime))
.ipAddress(ipAddress)
.build();
super.create(commentBlackList);
return CommentViolationTypeEnum.FREQUENTLY;
}
return CommentViolationTypeEnum.NORMAL;
}
-
查询当前 IP 是否处于封禁黑名单(comment_black_list 表)中。
-
查询系统设置的时间阈值 banTime(默认是 10 分钟),并判断从 banTime 分钟前到现在,当前 IP 的评论数是否超过了评论数阈值 range(默认是 30 个),如果超过了,那么就需要对当前 IP 实施封禁措施。换句话说,如果 banTime 分钟内,当前 IP 的评论数达到指定阈值,就对当前 IP 进行限流,这里 banTime 是评估封禁的参数,也可以称为时间阈值。
-
达到限流条件后,如果当前 IP 存在于封禁黑名单,那么更新 comment_black_list 表,将其解禁时间设置为 banTime 分钟后,虽然 comment_black_list 表中的属性 ban_time 在项目中被称为封禁时间,但结合代码可以发现它的真实含义是解禁时间。如果当前 IP 不在封禁黑名单,那么创建一条新的记录,IP 为当前请求的 IP,解禁时间为 banTime 分钟后。实际上,封禁黑名单的业务含义设置的并不严谨,它的作用仅仅是在数据表中创建或更新一条记录,且记录的解禁时间也只是一个参考值,因为评估 "限流" 的依据是 banTime 分钟前到现在的总评论数,与黑名单中的时间并无关联。Halo 中的 "限流" 机制类似于一个优先队列,队列的容量为 range,元素的属性包括 IP 和入队时间,如果元素入队的时间与当前时间的间隔达到 banTime,那么该元素出队,如果队列已满,那么实施 "限流",一旦队列恢复出至少一个空闲位置,那么用户便可再次发表评论。
-
达到限流条件后返回封禁状态 FREQUENTLY,否则返回 NORMAL。
了解了封禁机制后,我们再说一说 HTML 转义,转义指的是对一些特殊的标签,如 <
、>
、&
等进行转义,使系统认为其属于普通的符号,不具备标签功能。HTML 内容转义可以有效防止 XSS 攻击,HtmlUtils 工具类中的 htmlEscape 方法可实现转义操作。
接下来,我们来分析评论的创建过程,即 createBy 方法的处理逻辑:
public COMMENT createBy(@NonNull BaseCommentParam<COMMENT> commentParam) {
Assert.notNull(commentParam, "Comment param must not be null");
// Check user login status and set this field
Authentication authentication = SecurityContextHolder.getContext().getAuthentication();
// 博主的评论
if (authentication != null) {
// Blogger comment
User user = authentication.getDetail().getUser();
commentParam.setAuthor(
StringUtils.isBlank(user.getNickname()) ? user.getUsername() : user.getNickname());
commentParam.setEmail(user.getEmail());
commentParam.setAuthorUrl(
optionService.getByPropertyOrDefault(BlogProperties.BLOG_URL, String.class, null));
}
// Validate the comment param manually
ValidationUtils.validate(commentParam);
// 普通用户的评论
if (authentication == null) {
// Anonymous comment
// Check email
if (userService.getByEmail(commentParam.getEmail()).isPresent()) {
throw new BadRequestException("不能使用博主的邮箱,如果您是博主,请登录管理端进行回复。");
}
}
// Convert to comment
return create(commentParam.convertTo());
}
-
从 ThreadLocal 容器中获取用户信息,如果用户信息不为空,那么当前发表评论的用户为博主,因为普通用户是不需要登录的,确认博主身份后在 commentParam 参数中封装博主的信息。
-
校验 commentParam 参数是否符合 BaseCommentParam 类中制定的规则,例如评论者的昵称不能为空,邮箱格式必须正确等。
-
如果步骤 1 中用户信息为空,那么当前评论来自于普通用户。许多博客系统对普通用户的信息并没有太严格的要求,比如 Halo 中用户发表评论时只需要填写昵称和邮箱,但需要注意普通用户的邮箱不能和管理员的邮箱重复。
上述步骤中的验证操作通过后,执行 create 方法创建评论:
public COMMENT create(@NonNull COMMENT comment) {
Assert.notNull(comment, "Domain must not be null");
// 确保文章是存在的
// Check post id
if (!ServiceUtils.isEmptyId(comment.getPostId())) {
validateTarget(comment.getPostId());
}
// 如果 parentId 是非 0 的整数, 那么该评论为用户的回复, 该评论的 "父评论" 必须存在
// Check parent id
if (!ServiceUtils.isEmptyId(comment.getParentId())) {
mustExistById(comment.getParentId());
}
// Check user login status and set this field
final Authentication authentication =
SecurityContextHolder.getContext().getAuthentication();
// 设置默认值
// Set some default values
if (comment.getIpAddress() == null) {
comment.setIpAddress(ServletUtils.getRequestIp());
}
// 设置 useragent
if (comment.getUserAgent() == null) {
comment.setUserAgent(ServletUtils.getHeaderIgnoreCase(HttpHeaders.USER_AGENT));
}
// 设置头像
if (comment.getGravatarMd5() == null) {
comment.setGravatarMd5(
DigestUtils.md5Hex(Optional.ofNullable(comment.getEmail()).orElse("")));
}
// 将用户设置的 URL 规范化
if (StringUtils.isNotEmpty(comment.getAuthorUrl())) {
comment.setAuthorUrl(HaloUtils.normalizeUrl(comment.getAuthorUrl()));
}
// 来自于博主的评论, 评论状态直接为 PUBLISHED
if (authentication != null) {
// Comment of blogger
comment.setIsAdmin(true);
comment.setStatus(CommentStatus.PUBLISHED);
} else {
// Comment of guest
// Handle comment status
// 如果设置了评论审核, 需要将评论状态先设置为待审核状态
Boolean needAudit = optionService
.getByPropertyOrDefault(CommentProperties.NEW_NEED_CHECK, Boolean.class, true);
comment.setStatus(needAudit ? CommentStatus.AUDITING : CommentStatus.PUBLISHED);
}
// 创建评论
// Create comment
COMMENT createdComment = super.create(comment);
// 如果 parentId 为 0, 表示该评论是对文章的评论
if (ServiceUtils.isEmptyId(createdComment.getParentId())) {
if (authentication == null) {
// 新增评论事件
// New comment of guest
eventPublisher.publishEvent(new CommentNewEvent(this, createdComment.getId()));
}
} else {
// 回复评论事件
// Reply comment
eventPublisher.publishEvent(new CommentReplyEvent(this, createdComment.getId()));
}
return createdComment;
}
-
首先确保评论的合理性,即评论所属的文章必须存在,如果评论的 parentId 是非 0 的整数,那么该评论为用户的回复,该评论的 "父评论" 必须存在。
-
为评论的 ipAddress、useragent、头像设置默认值(如果为空),并对用户设置的 URL 做规范化处理。
-
如果评论来自于博主,那么将 isAdmin 设置为 true,并将评论的状态直接设置为 PUBLISHED。如果评论来自于普通用户且系统开启了审核机制,那么将评论的状态设置为待审核状态 AUDITING,处于 AUDITING 状态的评论需要博主审核通过后才能显示。
-
在 comments 表中创建评论,并发布相应的事件。如果评论的 parentId 为 0(该评论是对文章的评论)且该评论来自于普通用户,那么发布 "新增评论" 事件。如果 parentId 不为 0,发布 "回复评论" 事件。
create 方法执行成功后,一条评论就创建完成了 (^~^)!
查看评论我们在浏览文章时,可以看到文章底下用户的评论,其中排在前面的通常是一些高赞评论(神回复)或最新评论。如果评论数量较多,那么部分评论可能会被折叠,例如打开一篇文章:
上图中,我们只能看到文章的 "直系" 评论(对该文章的评论),而看不到对评论的评论。当文章被点开时,前端不仅会发送 archives/{slug}
请求来获取文章的具体内容,还会发送 api/content/posts/{postId}/comments/top_view
请求来获取属于该文章的 "直系" 评论,该请求由 PostController 中的 listTopComments 方法处理:
@GetMapping("{postId:\\d+}/comments/top_view")
public Page<CommentWithHasChildrenVO> listTopComments(@PathVariable("postId") Integer postId,
@RequestParam(name = "page", required = false, defaultValue = "0") int page,
@SortDefault(sort = "createTime", direction = DESC) Sort sort) {
return postCommentService.pageTopCommentsBy(postId, CommentStatus.PUBLISHED,
PageRequest.of(page, optionService.getCommentPageSize(), sort));
}
"Top comments" 指的就是 "直系" 评论,进入 pageTopCommentsBy 方法,查看列举 Top comments 的具体过程:
public Page<CommentWithHasChildrenVO> pageTopCommentsBy(@NonNull Integer targetId,
@NonNull CommentStatus status,
@NonNull Pageable pageable) {
Assert.notNull(targetId, "Target id must not be null");
Assert.notNull(status, "Comment status must not be null");
Assert.notNull(pageable, "Page info must not be null");
// 根据 postId、status、parentId 查询出所有 "直系" 评论, 非回复
// Get all comments
Page<COMMENT> topCommentPage = baseCommentRepository
.findAllByPostIdAndStatusAndParentId(targetId, status, 0L, pageable);
if (topCommentPage.isEmpty()) {
// If the comments is empty
return ServiceUtils.buildEmptyPageImpl(topCommentPage);
}
// 获取 "直系" 评论的 id 集合
// Get top comment ids
Set<Long> topCommentIds =
ServiceUtils.fetchProperty(topCommentPage.getContent(), BaseComment::getId);
// 获取每一条 "直系" 评论的子评论数
// Get direct children count
List<CommentChildrenCountProjection> directChildrenCount =
baseCommentRepository.findDirectChildrenCount(topCommentIds, CommentStatus.PUBLISHED);
// map 的 key 是 "直系" 评论的 id, value 是对应的子评论数
// Convert to comment - children count map
Map<Long, Long> commentChildrenCountMap = ServiceUtils
.convertToMap(directChildrenCount, CommentChildrenCountProjection::getCommentId,
CommentChildrenCountProjection::getDirectChildrenCount);
// Convert to comment with has children vo
return topCommentPage.map(topComment -> {
CommentWithHasChildrenVO comment =
new CommentWithHasChildrenVO().convertFrom(topComment);
comment
.setHasChildren(commentChildrenCountMap.getOrDefault(topComment.getId(), 0L) > 0);
comment.setAvatar(buildAvatarUrl(topComment.getGravatarMd5()));
return comment;
});
}
-
首先根据 postId、status、parentId 查询出所有 "直系" 评论,如果为空,那么直接返回空的 Page,否则执行下面的步骤。
-
将所有 "直系" 评论的 id 封装在 Set 集合中,并获取每一条评论的子评论数,之后构造 Map,其中 key 为 "直系" 评论的 id,value 为对应的子评论数。
-
利用 CommentWithHasChildrenVO 封装每一条评论的内容,并判断评论是否包含子评论(如果包含子评论,前端页面会显示 "更多" 按钮),最后设置头像信息。
通过上述操作可以查看到用户对文章的评论,如果希望看到对评论的回复,则需要点击 "更多" 按钮,此时前端发送 api/content/posts/{postId}/comments/{commentParentId}/children
请求,该请求由 PostController 中的 listChildrenBy 方法处理:
@GetMapping("{postId:\\d+}/comments/{commentParentId:\\d+}/children")
public List<BaseCommentDTO> listChildrenBy(@PathVariable("postId") Integer postId,
@PathVariable("commentParentId") Long commentParentId,
@SortDefault(sort = "createTime", direction = DESC) Sort sort) {
// Find all children comments
List<PostComment> postComments = postCommentService
.listChildrenBy(postId, commentParentId, CommentStatus.PUBLISHED, sort);
// Convert to base comment dto
return postCommentService.convertTo(postComments);
}
上述方法中,parentId 为某一条 "直系" 评论的 id,此 id 是一个大于 0 的整数,方法会返回该 "直系" 评论下状态为 PUBLISHED 的所有子评论。下面我们进入 service 层中的 listChildrenBy 方法,查看具体的逻辑:
public List<COMMENT> listChildrenBy(@NonNull Integer targetId, @NonNull Long commentParentId,
@NonNull CommentStatus status, @NonNull Sort sort) {
Assert.notNull(targetId, "Target id must not be null");
Assert.notNull(commentParentId, "Comment parent id must not be null");
Assert.notNull(sort, "Sort info must not be null");
// Get comments recursively
// 获取 "直系" 评论的回复
// Get direct children
List<COMMENT> directChildren = baseCommentRepository
.findAllByPostIdAndStatusAndParentId(targetId, status, commentParentId);
// Create result container
Set<COMMENT> children = new HashSet<>();
// 递归获取 "直系" 评论的回复的回复
// Get children comments
getChildrenRecursively(directChildren, status, children);
// Sort children
List<COMMENT> childrenList = new ArrayList<>(children);
// 对结果进行排序, 按照 commentId 升序排
childrenList.sort(Comparator.comparing(BaseComment::getId));
return childrenList;
}
-
首先获取 "直系" 评论的回复,为了便于表述,我们将 "直系" 评论称为一级评论,那么 "直系" 评论的回复就称为二级评论,以此类推。
-
由于二级评论下方也可能会有回复,即三级评论,因此需要递归获取所有的子评论。
-
获取到子评论后将所有的评论按照 id 升序排列并返回。
实际上在许多网站中,属于文章的评论("直系" 评论)和属于评论的评论确实会做一个分级展示,但评论的评论之间一般是并列展示的:
上图中,"直系" 评论下方有两条子评论,其中子评论 2("好的")是对子评论 1("收到")的回复,二者在前端的排版上属于同一级,但为了更好地理清其中的逻辑关系,我们将其分为 "二级" 和 "三级"。下面查看递归方法 getChildrenRecursively 查找不同级别评论的过程:
private void getChildrenRecursively(@Nullable List<COMMENT> topComments,
@NonNull CommentStatus status, @NonNull Set<COMMENT> children) {
Assert.notNull(status, "Comment status must not be null");
Assert.notNull(children, "Children comment set must not be null");
if (CollectionUtils.isEmpty(topComments)) {
return;
}
// 当前级别评论的 id 集合
// Convert comment id set
Set<Long> commentIds = ServiceUtils.fetchProperty(topComments, COMMENT::getId);
// 获取下一级评论
// Get direct children
List<COMMENT> directChildren =
baseCommentRepository.findAllByStatusAndParentIdIn(status, commentIds);
// 获取下下一级评论
// Recursively invoke
getChildrenRecursively(directChildren, status, children);
// 将评论封装在 Set 集合中
// Add direct children to children result
children.addAll(topComments);
}
-
首先获取当前级别评论的 id 集合,并根据 id 集合从数据库中获取下一级评论。
-
执行递归方法,根据下一级评论获取下下级评论。
-
将当前级别的评论存入到 Set 集合。
以上便是用户浏览评论时后台服务器的处理流程。
评论的通知Halo 中设置了评论通知的功能,当用户发送评论时,系统会发送邮件通知博主。当博主回复用户的评论时,如果用户设置的 Email 是有效的邮箱,那么博主回复的内容也会被发送到用户的邮箱中。下面以 QQ 邮箱为例,介绍一下操作过程。
首先进入 QQ 邮箱,点击左上角的 "设置",选择 "账户"。向下拉,找到 "POP3/IMAP/SMTP/Exchange/CardDAV/CalDAV服务",开启 "POP3/SMTP服务":
然后点击生成授权码,使用密保手机发送指定短信后就可以收到授权码。接着进入 Halo 的管理员界面,点击 "系统" -> "博客设置",选择 "SMTP 服务" 并填写信息,邮箱账号填写自己的 QQ 邮箱,密码是生成的授权码:
填写完成后点击保存,在右侧的 "发送测试" 选项中测试是否能正常发送邮件,收件人地址需要填写一个正确的 Email 地址,一般情况下是能够发送成功的。此外,还需要在 "评论设置" 选项中开启 "评论回复通知对方",最后保存设置。这样,当博主回复时,用户的邮箱就可以收到博主回复的内容了:
点赞Halo 项目中,文章的点赞量是作为一个属性封装在 BasePost 实体中的,因此更新点赞量的时候需要更新 posts 数据表,这种处理方式在用户量较少的个人博客系统中是可行的,因为并发量一般不会超出数据库的可承受范围,而且由于普通用户不需要登录,所以可以不用考虑用户的取消点赞操作。但是需要注意的是,对于拥有大量用户的博客平台或者社区论坛系统,此种方式就不再适用了,因为点赞操作是一个高频调用的功能,频繁操作数据库可能会使服务器崩溃。
下面我们分析一下点赞功能的实现过程,由于默认的主题 caicai_anatole
没有提供点赞按钮,所以我们将主题更换为 joe2.0
(其它主题也可)。进入文章详情页,点击 "点赞" 按钮后,触发 /api/content/posts/1/likes
请求,该请求由 PostController 中的 like 方法处理:
@PostMapping("{postId:\\d+}/likes")
@ApiOperation("Likes a post")
@CacheLock(autoDelete = false, traceRequest = true)
public void like(@PathVariable("postId") @CacheParam Integer postId) {
postService.increaseLike(postId);
}
like 方法调用 increaseLike 方法来增加点赞量,increaseLike 方法的处理逻辑也非常简单,就是将 id 为 postId 的文章的点赞量加一 ρ(^ o ^)♪。
结语
本文以文章为例,介绍了评论和点赞功能的实现过程,由于对页面的评论和点赞与之类似,因此便不再赘述了。