开发提示词:Flask+MySQL + UniApp 视频播放器项目(后端+前端+API+数据库全流程)
适用于AI代码生成、开发协作、需求文档,分模块完整细化,可直接复制使用,包含架构、功能、接口、数据库、样式、交互、部署要求。
一、整体项目总需求(开头通用描述)
请开发一套移动端视频播放器完整应用,技术栈组合:后端:Python Flask + MySQL 8.0前端:UniApp(Vue3 + 原生uniapp语法,兼容微信小程序/APP/H5三端)整体实现:视频上传、视频列表、在线播放、分类筛选、播放记录、点赞收藏、分页加载、视频详情等核心功能。要求代码结构规范、注释完整、接口统一、可直接运行,附带数据库脚本、接口文档、运行说明。
二、后端 Flask + MySQL 详细开发提示词
(1)技术&架构要求
编程语言:Python 3.8+,框架:Flask,使用 Flask-SQLAlchemy 操作MySQL,Flask-CORS 解决跨域。 项目目录分层:路由层、模型层、工具层、配置层、静态资源层,目录结构清晰。 配置文件独立存放:数据库地址、账号、密码、端口、文件上传路径、允许文件格式、文件大小限制。 编码统一使用UTF-8,接口返回标准JSON格式,统一状态码、提示语。 视频、封面图均做本地文件存储,返回可访问网络地址,禁止绝对路径。 增加基础异常捕获、日志打印,上传文件做格式、大小校验。
(2)MySQL 数据库设计(数据表+字段)
创建2张核心数据表,附带建表SQL语句:
video 视频主表
id:主键自增 int title:视频标题 varchar(100) cover_img:视频封面图地址 varchar(255) video_url:视频播放地址 varchar(255) category:视频分类 varchar(50)(如:影视、动漫、生活、音乐) play_count:播放次数 int 默认0 like_count:点赞数 int 默认0 collect_count:收藏数 int 默认0 intro:视频简介 text create_time:发布时间 datetime status:状态 tinyint(0=下架,1=正常) play_record 播放记录表
id:主键自增 int video_id:关联视频ID int create_time:播放时间 datetime (可选扩展:用户ID,简易版可先做匿名播放记录)
(3)后端核心功能 & 接口列表(RESTful 风格)
所有接口请求方式、入参、出参、功能明确,统一返回格式:
{"code": 状态码(200成功/400参数错误/500服务器错误),"msg": "提示信息","data": 业务数据}接口1:获取视频分类列表
请求方式:GET 接口地址: /api/category功能:返回所有视频分类名称
接口2:分页获取视频列表(支持分类筛选)
请求方式:GET 接口地址: /api/video/list请求参数: page:页码(默认1) page_size:每页条数(默认10) category:分类名称(非必传,不传查全部) 返回:视频ID、标题、封面、播放量、分类
接口3:获取视频详情
请求方式:GET 接口地址: /api/video/detail请求参数:video_id(视频ID) 功能:返回视频完整信息 + 播放地址,并自动累加播放次数
接口4:视频点赞
请求方式:POST 接口地址: /api/video/like请求参数:video_id 功能:对应视频点赞数+1
接口5:视频收藏
请求方式:POST 接口地址: /api/video/collect请求参数:video_id 功能:对应视频收藏数+1
接口6:添加播放记录
请求方式:POST 接口地址: /api/record/add请求参数:video_id 功能:新增一条播放记录
接口7:获取我的播放记录(分页)
请求方式:GET 接口地址: /api/record/list请求参数:page、page_size 功能:按时间倒序返回历史播放视频
接口8:后台视频上传(管理端接口)
请求方式:POST 接口地址: /api/video/upload传参:表单形式(标题、分类、简介、封面图文件、视频文件) 限制:仅允许 mp4 视频、jpg/png 图片,限制单文件大小 功能:文件保存至服务器,数据写入数据库
(4)后端额外要求
静态资源路由:配置 /static目录,前端可直接访问图片、视频文件。文件上传目录:单独创建 static/cover(封面)、static/video(视频)。跨域全局开启,适配UniApp多端请求。 提供完整启动命令、依赖清单(requirements.txt)。
三、UniApp 前端 详细开发提示词(Vue3 + UniApp 原生)
(1)运行&兼容要求
框架:UniApp + Vue3,使用组合式API,兼容微信小程序、App、H5三端。 不使用第三方复杂UI框架,优先使用uniapp原生组件。 页面样式适配移动端,分辨率自适应,支持下拉刷新、上拉触底分页。 全局封装 请求工具类(uni.request),统一接口地址、请求拦截、错误提示。
(2)全局配置
新建 utils/request.js封装网络请求,统一后端接口域名。全局样式 App.vue设置页面基础样式、字体、边距。页面路由在 pages.json配置,底部导航栏开启。
(3)页面结构(共5个核心页面)
页面1:首页(pages/index/index)
顶部:搜索栏 + 分类横向滚动标签(影视/动漫/生活/音乐) 主体:视频瀑布流/网格列表,卡片形式展示:封面图、标题、播放量 交互: 点击分类标签筛选对应视频 上拉触底加载下一页 下拉刷新重置列表 点击视频卡片跳转到播放页
页面2:视频播放页(pages/play/play)【核心页面】
顶部:自定义导航栏(返回按钮、视频标题) 核心组件:uniapp原生 video 视频播放器 配置:自动播放、全屏按钮、进度条、倍速、播放暂停、全屏功能 监听视频播放结束、暂停、播放事件 播放器下方:视频标题、简介、播放量、点赞按钮、收藏按钮 底部:相关推荐视频列表 交互: 进入页面自动上报播放记录 点击点赞/收藏按钮调用对应接口,动态更新数字 支持横竖屏切换
页面3:分类页(pages/category/category)(可选,也可合并至首页)
展示全部分类,点击分类进入对应视频列表
页面4:播放记录页(pages/record/record)
列表展示历史播放视频,按时间倒序 每条记录:封面、标题、播放时间 点击条目重新播放视频 支持清空播放记录功能
页面5:我的页面(pages/mine/mine)
个人中心入口:播放记录、关于我们等基础菜单
(4)组件&交互细节
视频卡片:封面图等比例裁剪,加载中显示占位图。 网络请求加载:添加 uni.showLoading加载提示,请求完成关闭。异常处理:接口请求失败、视频加载失败时,弹出友好提示。 视频播放器优化:适配小程序/App/H5不同端的播放权限。 分页逻辑:记录当前页码、总条数,无更多数据时提示「没有更多视频」。
(5)pages.json 配置要求
配置底部 tabBar:首页、播放记录、我的 三个导航项。 关闭默认导航栏(播放页自定义导航),设置页面标题、窗口样式。 配置小程序必要权限、H5 运行参数。
四、前后端联调 & 接口规范统一要求
前端所有请求地址统一前缀: http://127.0.0.1:5000/api(后端默认端口5000)。前后端参数名保持一致,字段命名统一使用小写+下划线。 所有列表接口统一分页逻辑:page / page_size。 视频、图片地址后端返回完整可访问URL,前端直接赋值给video组件、image组件。 开发环境:后端本地运行,前端模拟器/真机联调。
五、交付物要求(最终输出内容)
后端:完整Flask项目代码 + MySQL建表SQL + requirements.txt + 运行步骤。 前端:完整UniApp项目代码 + pages.json + 全局请求工具类。 完整API接口文档(地址、参数、返回示例)。 部署&运行图文步骤:本地启动后端、导入数据库、运行UniApp项目。 代码关键位置添加中文注释,方便二次修改与扩展。
六、精简版一键复制提示词(直接给AI使用)
如需快速生成,复制下面整段即可:
请基于 Python Flask + MySQL 8.0 + UniApp(Vue3) 开发一套三端通用移动端视频播放器应用,包含完整后端、前端、数据库、API接口。一、后端要求:1. 使用Flask、Flask-SQLAlchemy、Flask-CORS,规范分层目录,配置文件独立,统一JSON返回格式(code/msg/data)。2. 设计两张数据表:video视频表、play_record播放记录表,提供完整建表SQL。3. 实现接口:分类列表、视频分页列表、视频详情、点赞、收藏、添加播放记录、播放记录分页、视频文件上传接口。4. 视频和封面图本地存储在static目录,校验文件格式与大小,开启跨域,附带依赖清单和启动说明。二、UniApp前端要求:1. 使用Vue3组合式API,兼容微信小程序、App、H5三端,封装全局request请求。2. 制作5个页面:首页(分类标签+视频列表、下拉刷新、上拉分页)、视频播放页(原生video播放器、点赞收藏、上报播放记录)、播放记录页、个人中心页。3. 配置底部tabBar,视频卡片样式美观,加载状态、异常提示完善,播放器支持全屏、暂停、进度调节。三、联调与交付:前后端接口参数统一,提供完整代码、数据库脚本、接口文档、详细运行部署步骤,代码添加中文注释,保证可直接本地运行。
夜雨聆风