0


【ubuntu云服务器部署公网Web抽奖工具】CSDN博客评论区用户抽奖

系列文章目录

送书第一期 《用户画像:平台构建与业务实践》
送书活动之抽奖工具的打造 《获取博客评论用户抽取幸运中奖者》


文章目录


前言

前几天做了一期送书活动,随着时间流逝,也即将迎来赠书活动抽奖环节,为了活动的公正公开以及可见性,特此开发了一款Web抽奖工具,结合Springboot后台获取博客评论用户接口,打造了一款公开透明的抽奖工具,大家都可以来玩一玩。

工具地址: http://139.159.230.49/draw.html
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

获取博客评论用户接口(url后的参数可替换为想要的博客地址): http://139.159.230.49/csdn/draw/url?url=https://blog.csdn.net/weixin_39709134/article/details/133195146
在这里插入图片描述


一、抽奖页面

在这里插入图片描述

1.1、页面源代码

页面是单文件引入vue,所有的CSS、JS文件都是放在CDN上,此源代码直接复制即可用

1.2、页面组成

博客赠书抽奖页面,由4部分组成

  • 抽奖博客地址、过滤账号(可过滤作者自身账号)、获取抽奖账号名单按钮
  • 抽奖池用户名单显示区域
  • 抽奖按钮、已抽奖次数
  • 获奖名单

1.3、抽奖博客地址

填写需要抽奖的CSDN博客地址
如(用户画像:平台构建与业务实践):https://blog.csdn.net/s445320/article/details/133265834
在这里插入图片描述

1.4、过滤账号(可过滤作者自身账号)

在赠书时,我们可过滤掉作者自身账号,或者其他账号。
如不能满足需求,可以自行改造过滤逻辑。

1.5、获取抽奖账号名单按钮

点击此按钮,根据1.3、1.4 所填写的内容,去获取抽奖账号名单(可见第2部分 springboot抽奖账号名单接口)

1.6、抽奖池用户名单显示区域

展示抽奖池用户名单。

  • 多次评论的人,抽中概率会增加,所以会展示多次评论;
  • 中奖的人名单,会从此区域去掉,一个人只能中奖一次(如果有多次评论,也会从名单里全部去掉,不参与下一轮抽奖)

1.7、抽奖按钮、已抽奖次数

在展示抽奖池用户名单后,即可点击抽奖按钮;
已抽奖次数会累加。

1.8、中奖名单

展示中奖者的名单,使用逗号(,)隔开

  • 多次评论的人,中奖概率会增加;
  • 一个人只能中奖一次;
  • 赠送几本书就点击【抽奖按钮】几次

二、springboot抽奖账号名单接口

获取博客评论用户接口(url后的参数可替换为想要的博客地址): http://139.159.230.49/csdn/draw/url?url=https://blog.csdn.net/weixin_39709134/article/details/133195146
在这里插入图片描述

2.1、接口在服务端已做跨域处理

在这里插入图片描述

2.2、根据博客地址获取评论信息

2.2.1、找到博客地址评论信息的CSDN接口

通过Chrome的【开发者工具】,在【网络】区域找到评论信息;

1、切换到【预览】,通过响应数据,确认是我们要找的接口
在这里插入图片描述

2、切换到【标头】,拿到请求地址,并测试get、post请求类型
在这里插入图片描述

2.3、服务端根据博客地址获取评论信息核心代码

1、从URL里提取出博客唯一ID;
2、通过CSDN评论信息接口,获取评论数据信息;
3、格式化数据,返回用户名、用户ID集合信息;

publicList<DrawUser>getDrawUserList(String blogUrl){int page =1;int pageSize =100;RestTemplate restTemplate =newRestTemplate();List<DrawUser> drawUserList =newArrayList<>();String blogId ="";//处理特殊字符?if( blogUrl.indexOf("?")!=-1){
            blogUrl = blogUrl.substring(0, blogUrl.indexOf("?"));}//处理特殊字符#if( blogUrl.indexOf("#")!=-1){
            blogUrl = blogUrl.substring(0, blogUrl.indexOf("#"));}int start = blogUrl.indexOf("details");if( start ==-1){
            log.info("格式错误");returnnull;}else{
            blogId = blogUrl.substring(start+8, blogUrl.length());}//循环加载多页数据,每页100条while(true){//页码每次+1String url ="https://blog.csdn.net/phoenix/web/v1/comment/list/"+ blogId +"?page="+ page+++"&size="+ pageSize +"&fold=unfold";HashMap jsonObject =  restTemplate.getForObject(url,HashMap.class);if(!jsonObject.get("code").equals(200)){return drawUserList;}if( jsonObject.get("code").equals(200)){LinkedHashMap blogInfoMap =(LinkedHashMap) jsonObject.get("data");//获取单次请求的评论信息集合List<HashMap> userInfoList =(List<HashMap>) blogInfoMap.get("list");for(int i =0; i < userInfoList.size(); i++){HashMap userInfo = userInfoList.get(i);//提取出userName、nickNameHashMap info =(HashMap) userInfo.get("info");//把用户信息添加到集合里
                    drawUserList.add(newDrawUser(info.get("userName")+"", info.get("nickName")+""));}if( userInfoList.size()< pageSize ){
                    log.info("数据加载完毕");return drawUserList;}}}
        log.info("评论人数:"+ drawUserList.size());//返回用户信息集合return drawUserList;}

总结

后续还有很多赠书活动,特此开发了一个Web版本抽奖工具,基本上通用(覆盖了一些场景,还谈不上完美),可以解决CSDN博客几百评论用户信息获取问题。

标签: 前端 ubuntu 云服务

本文转载自: https://blog.csdn.net/s445320/article/details/133349692
版权归原作者 青花锁 所有, 如有侵权,请联系我们删除。

“【ubuntu云服务器部署公网Web抽奖工具】CSDN博客评论区用户抽奖”的评论:

还没有评论