更新记录

v1.0.0（2025-07-17） 下载此版本

• 多种布局的视频列表（左右滚动、双列、三列、左右结构、带背景图列表等，需使用hypercmf-playlet管理后台效果明显）
• 全屏竖屏播放器，支持解锁剧集和选集
• 弹窗登录页面封装（google登录）
• 充值页面
• 钱包账户
• 收藏、点赞

平台兼容性

uni-app(4.56)

uni-app x(4.55)

其他

多语种短剧盈利引擎，多语言可出海短剧短视频项目（适配H5、小程序、APP)

作者：Hypercmf

项目描述

 * 本项目致力于实现短剧平台出海业务的uniapp前端项目模板，可以通过切换语言进行对应数据的展示。支持H5、小程序、APP。
 * 视频播放页面自动匹配nvue文件，兼容安卓、ios
 * 项目已提供本地json数据，可以直接运行查看效果。

项目功能

 * 多种布局的视频列表（左右滚动、双列、三列、左右结构、带背景图列表等，需使用hypercmf-playlet管理后台效果明显）
 * 全屏竖屏播放器，支持解锁剧集和选集
 * 弹窗登录页面封装（google登录）
 * 充值页面
 * 钱包账户
 * 收藏、点赞

短剧出海功能展示

播放选集

---

APP页面效果

---

H5页面效果

---

小程序页面效果

---

其他页面

主要业务目录结构

此处对标准uniapp目录中重要目录进行说明

      ├── /
      │   ├── locale //语言包
      │   │   ├── en.json //英语
      │   │   ├── zh-Hans.json //中文
      │   │   ├── uni-app.en.json //uniapp系统语言英文包
      │   ├── pages //标准uniapp主包业务页面
      │   ├── static // 商城分包页面
      │   │   ├── logo.png //可以替换的logo
      │   │   ├── data //本地测试静态数据包

封装

• 封装的common.js内包含了统一请求方法，使用的是ES6标准的Promise：

  • 使用env参数区分开发环境、测试环境、正式环境的打包参数
  • 第55行强制给hostName赋值为json以便项目可以使用本地静态json数据进行页面渲染，使用时，请擅长此行代码
  • 封装统一的request及接口的api路由（有完整后台管理系统，需另行获取）
  • 统一封装了上传方法、登录方法、微信支付方法等（不过需要结合Hypercmf后端），仅供参考和讨论。

• 封装了Vuex store，减少写代码的冗余：

  • 将原有的store进行了二次封装，可以在/store/index.js第41行state对象中添加全局变量，在任何page使用直接this.$u.vuex('key',value)进行赋值，在使用时直接使用this.key获取全局变量的值
  • 全局变量如果需要存储到本地换成，请在 /store/index.js第23行的 saveStateKeys数组中，将对应的key添加进数组