uni-app实战app开发完结

huo1234567 · · 61 次点击 · · 开始浏览    

本次直播 APP 全栈开发旨在打造一个功能完备、用户体验良好的直播平台,涵盖用户注册登录、主播开播、观众观看直播及实时互动等核心功能。前端运用 uni-app 框架实现多平台适配,后端采用 Node.js 结合 Express 搭建稳定的服务架构,并借助 MongoDB 存储各类数据。同时,引入 Socket.io 实现实时通信功能。

获课:keyouit.xyz/1887/

获取ZY↑↑方打开链接↑↑

bash复制代码

bash复制代码

字段类型描述_idObjectId用户唯一标识符usernameString用户名passwordString加密后的用户密码emailString用户邮箱roleString用户角色,如“user”(普通用户)或“host”(主播),默认为“user”avatarString用户头像链接

_id

ObjectId

用户唯一标识符

username

String

用户名

password

String

加密后的用户密码

email

String

用户邮箱

role

String

用户角色,如“user”(普通用户)或“host”(主播),默认为“user”

avatar

String

用户头像链接

字段类型描述_idObjectId直播唯一标识符hostIdObjectId主播用户 ID,关联用户表titleString直播标题descriptionString直播描述startTimeDate直播开始时间endTimeDate直播结束时间(可为空)viewersNumber观看人数statusString直播状态,如“upcoming”(即将开始)、“live”(直播中)、“ended”(已结束)streamUrlString直播流链接

_id

ObjectId

直播唯一标识符

hostId

ObjectId

主播用户 ID,关联用户表

title

String

直播标题

description

String

直播描述

startTime

Date

直播开始时间

endTime

Date

直播结束时间(可为空)

viewers

Number

观看人数

status

String

直播状态,如“upcoming”(即将开始)、“live”(直播中)、“ended”(已结束)

streamUrl

String

直播流链接

字段类型描述_idObjectId消息唯一标识符liveIdObjectId所属直播 ID,关联直播表senderIdObjectId发送者用户 ID,关联用户表messageString聊天消息内容sendTimeDate发送时间

_id

ObjectId

消息唯一标识符

liveId

ObjectId

所属直播 ID,关联直播表

senderId

ObjectId

发送者用户 ID,关联用户表

message

String

聊天消息内容

sendTime

Date

发送时间

字段类型描述_idObjectId礼物唯一标识符nameString礼物名称priceNumber礼物价格(虚拟货币单位)imageUrlString礼物图片链接

_id

ObjectId

礼物唯一标识符

name

String

礼物名称

price

Number

礼物价格(虚拟货币单位)

imageUrl

String

礼物图片链接

字段类型描述_idObjectId记录唯一标识符gifterIdObjectId赠送者用户 ID,关联用户表liveIdObjectId所属直播 ID,关联直播表giftIdObjectId赠送的礼物 ID,关联礼物表giveTimeDate赠送时间

_id

ObjectId

记录唯一标识符

gifterId

ObjectId

赠送者用户 ID,关联用户表

liveId

ObjectId

所属直播 ID,关联直播表

giftId

ObjectId

赠送的礼物 ID,关联礼物表

giveTime

Date

赠送时间

在 MongoDB 中创建数据库 live_app_db 以及上述集合。

在 live_app_backend 目录下创建 db.js 文件:

javascript复制代码

在 live_app_backend 目录下创建 models 文件夹,在其中分别创建 user.js、live.js、chatMessage.js、gift.js 和 giftGiving.js 文件定义各个模型。

javascript复制代码

javascript复制代码

javascript复制代码

javascript复制代码

javascript复制代码

在 live_app_backend 目录下创建 routes 文件夹,在其中创建 userRoutes.js、liveRoutes.js、chatRoutes.js、giftRoutes.js 文件分别处理用户、直播、聊天和礼物相关的 API。

javascript复制代码

javascript复制代码

javascript复制代码

javascript复制代码

在 live_app_backend 目录下创建 app.js 文件:

javascript复制代码

使用 HBuilderX 创建一个新的 uni-app 项目,选择默认模板。

在 pages 目录下创建 home.vue、live.vue、login.vue、register.vue、giftList.vue 等页面。

html复制代码

61 次点击  
加入收藏 微博
添加一条新回复 (您需要 登录 后才能回复 没有账号 ?)
  • 请尽量让自己的回复能够对别人有帮助
  • 支持 Markdown 格式, **粗体**、~~删除线~~、`单行代码`
  • 支持 @ 本站用户;支持表情(输入 : 提示),见 Emoji cheat sheet
  • 图片支持拖拽、截图粘贴等方式上传