3.1 堆糖 首页 推荐 功能分析 - WhiteYin/simple-duitang GitHub Wiki

前言

功能分析都是基于APP抓包接口数据来分析的。所以和产品、UI等人员分析的角度不太一样。

消息推送(?)

这个功能是不是这个意思我并不太清楚,只是根据接口路径为notify/list/来推断的。目前(7月31日)这个接口返回的数据如下:

{
  "status": 1,
  "message": "success",
  "data": [
    {
      "body": "成为研究员获得超级特权",
      "url": "https://www.duitang.com/class/researcher/recruit/notify/",
      "type": 0
    }
  ]
}

功能就是在内容区顶部展示,点击后跳转到url的那个链接。

轮播图

从app请求的接口来看,分为教程文章和商店折扣两种。但这里有个问题是顺序并不太对。我感觉有特别的规则,但由于黑盒检查这个细节可能没法完全复现了。
主要用到了接口返回的image_url字段。同时还有起始日期和截止日期。这个也不用管了……
另一个让我很疑惑的是,请求接口是需要传入一个ad_id参数,但这个值不知道什么时候获取的。如果我能找到的话,应该能动态实现这个功能了。 最后一个疑惑点(这轮播图功能事真多!)就是有一个堆糖Class的宣传图但并没有找到什么时候调用接口……

功能的话,首先是循环轮播功能,也就是从最后一张滑动会无缝切换到第一张;其次是点击后跳转到target对应的链接。

8月3日更新:广告的获取是从推荐内容-广告内容中ap_001获取的,通过position.y来决定图片插入位置(从0开始)。

推荐内容

用户内容

用户内容要调用的接口返回数据特别多,我大概分析了一下应该要的字段:

  1. style:内容类型(article_normal和atlas)
  2. article:文章
    1. id:文章id
    2. sender:用户信息
      1. id:用户id
      2. username:用户名
      3. avatar:用户头像
      4. is_certify_user:是否加V
    3. title:文章标题
    4. cover:缩略内容
      1. photo_path:缩略图地址
    5. share_links_3:生成分享的链接
    6. like_count:点赞数
    7. comment_count:评论数
    8. is_video_article:文章中是否带有视频
  3. atlas:图集(?)
    1. id:图集id
    2. sender:与article中类似
    3. blogs:数组
      1. photo:图片信息
        1. path:图片路径
        2. height:图片长度
  4. icon_infos:图标数据,是一个数组。第一项是点赞,第二项是评论,第三项为分享。
    1. icon_url:图标地址

可以看出功能点很多:

  1. 显示作者头像与姓名;
  2. 根据是否加V,在头像右下角加上黄色v;
  3. 渲染【热门内容】字段;
  4. 根据类型,分成文章和图集两类内容:
    1. 文章
      1. 显示文章标题
      2. 右上角显示【文章】标识
      3. 加载缩略图
      4. 如果是视频文章,缩略图上【可能需要】显示播放图标及视频时长
    2. 图集
      1. 显示上传图片时的文字
      2. 9宫格排列图片,如果图片长度大于某个值,需要在该图片的左上角加上【长图】标识
  5. 显示点赞数、评论数和分享。点击评论跳转到内容详情;点击点赞判断是否登录;点击分享显示分享框。

广告内容

接口ad/list/by_ad_place,如果传入ad_places=ap_002,ap_001参数的话,会返回推荐的文章或广告(ap_002),以及轮播图中的广告图片(ap_001)。

轮播图的不用管,只看内容列表中需要渲染的文章或广告。

目前根据接口返回的type来看,有3种类型:

1. NORMAL_ARTICLE 广告文章

这个跟热门内容的文章一个处理,但是要有一点区别是没有article字段,而是entity字段。

效果也与文章一致,但是不需要标明【热门内容】。

2. BANNER_AD 横幅广告

跟文章差不多,没article字段,使用entity字段。

功能:

  1. 不显示【热门内容】标识
  2. 缩略图左上角显示【广告】字样
  3. 没有点赞、评论和收藏
  4. 跳转后去第三方页面

3. VIDEO_AD 视频广告

在我的7.0 app中没有看到这个,所以不太清楚要做成什么效果。以后再说吧。

注意点

以上广告内容都根据position.y的值来决定插入位置,从0开始计数。

我估计,热门内容是一个数组,广告内容是一个数组。最终的结果数组是先将广告内容填入指定位置,然后把热门内容按顺序插入,如果遍历的当前位置有值,则顺延到下一个位置。

分享框

对文章内容,会有一个分享按钮,点击后弹出分享框与遮罩层。

分享的第三方网站有:微博、朋友圈、微信好友、QQ好友、QQ空间和更多(打开应用列表) 此外,分享框的第二行还有收藏与举报操作,都需要登录状态。

下拉刷新&上拉加载

没有登录时,这两个功能都平平无奇,就是正常的重新调用接口而已。

效果

上拉加载时,显示转圈图标,有新内容时图标消失,加载新内容。

下拉刷新时,按住不放显示【松开立即刷新】,松开后显示【转圈图标与正在刷新】,刷新成功后显示【成功图标与刷新成功】。

已登录

如果已登录,会记录上一次浏览的位置。但是这个功能我在体验时并没有感觉到有什么用。再说吧。

此外还会显示【已为你推荐xx条新内容】的提示,动画为向下滑入&向上滑出。

其他

  1. 点击首页会回到顶部并刷新推荐内容。
  2. 首次显示推荐时,内容区显示【转圈图标】与纯白色背景。