实现视频交互系统中的“喜欢的视频列表”和“视频详情”功能

在构建视频交互系统时,添加"喜欢的视频列表"和"视频详情"功能能极大提升用户体验。本文将详细介绍如何在Node.js环境中使用Express框架和Mongoose来实现这两个功能。

喜欢的视频列表展示

实现喜欢的视频列表功能主要涉及到路由的设置、控制器的编写以及对数据库的查询操作。

1. 新建路由

首先,我们需要在Express的路由文件中定义一个新的路由,用于获取"喜欢的视频列表"。

js 复制代码
router
  .get('/likeList', verifyToken(), videoController.likeList)

这里的verifyToken()是一个中间件,用于验证用户的登录状态。

2. 编写Controller

在控制器文件中,我们添加likeList函数来处理视频列表的获取逻辑。

js 复制代码
exports.likeList = async (req, res) => {
  const { pageNum = 1, pageSize = 10 } = req.body;
  let likes = await VideoLike.find({
    like: 1,
    user: req.user.userinfo._id
  }).skip((pageNum - 1) * pageSize)
    .limit(pageSize)
    .populate('video', "_id title vodVideoId user");

  let likeCount = await VideoLike.countDocuments({
    like: 1,
    user: req.user.userinfo._id
  });
  res.status(200).json({ likes, likeCount });
}

这段代码主要实现了分页查询和关联查询的功能,通过Mongoose的populate方法关联查询了视频的详细信息。

3. Postman测试

使用Postman对新建的接口进行测试,确保其返回正确的数据格式和内容。

补全视频详情逻辑

接下来,我们需要完善视频详情页的功能,包括喜欢、不喜欢和订阅的状态显示。

1. 补全视频详情逻辑

在视频详情的控制器中,我们补全了之前缺失的逻辑。

js 复制代码
javascriptCopy code
exports.video = async (req, res) => {
  const { videoId } = req.params;
  let videoInfo = await Video
    .findById(videoId)
    .populate('user', '_id username cover');

  videoInfo = videoInfo.toJSON();
  videoInfo.isLike = false;
  videoInfo.isDislike = false;
  videoInfo.isSubscribe = false;

  if (req.user.userinfo) {
    const userId = req.user.userinfo._id;
    if (await VideoLike.findOne({ user: userId, video: videoId, like: 1 })) {
      videoInfo.isLike = true;
    }
    if (await VideoLike.findOne({ user: userId, video: videoId, like: -1 })) {
      videoInfo.isDislike = true;
    }
    if (await Subscribe.findOne({ user: userId, channel: videoInfo.user._id })) {
      videoInfo.isSubscribe = true;
    }
  }

  res.status(200).json(videoInfo);
}

2. Postman验证

再次使用Postman来验证补全后的视频详情接口,确保各状态正确反映。

总结

通过本文的指导,你可以在自己的视频交互系统中实现类似的"喜欢的视频列表"和"视频详情"功能。这些功能不仅提升了用户体验,还增加了应用的交互性。

相关推荐
程序猿乐锅13 分钟前
【从0-1学习Python | 第七篇】Python 面向对象基础
开发语言·笔记·后端·python·学习·1024程序员节
code2cat30 分钟前
Java高级篇之Hibernate:让对象映射到表,理解持久化与事务
java·后端·hibernate·1024程序员节
Younglina42 分钟前
三个晚上,我和 WorkBuddy 做了个生图网站
前端·后端·ai编程
金銀銅鐵2 小时前
[Java] 用 CLI 展示 EnumSet 增减元素时的内部变化(下)
java·后端·ai编程
陈随易2 小时前
副业搞钱点子之收入查看器
前端·后端
Profile排查笔记2 小时前
浏览器指纹逆向怎么分析:从网络请求追踪到 JavaScript 采集链
前端·人工智能·后端·自动化
lazy H3 小时前
【计算机网络】第 5 篇:TCP 和 UDP 有什么区别?从 Java 后端场景理解两种传输协议
经验分享·后端·网络协议·tcp/ip·计算机网络·1024程序员节
东宇科技3 小时前
crmeb开源版本安装步骤2026-10-20
后端·php·crmeb
IT_Octopus3 小时前
Apollo 配置中心入门:一所“小学校“读懂 Portal、Meta Server、Config Service
java·后端·spring
CHHH_HHH4 小时前
【Linux网络篇】初识网络与Socket编程基础
linux·服务器·c语言·开发语言·网络·后端·1024程序员节