H5 端 · 浏览器直达 · 免安装

打开浏览器就能看直播、下单购物

基于 UniApp 打包的 H5 用户端，浏览器/微信内置浏览器直接打开即用
三端统一 API，与小程序、数据大屏实时同步，真正的一次开发多端部署

3 页面
极致精简
H5 直达
零安装门槛
微信分享
社交裂变
HLS 拉流
1-3s 延迟
界面预览

三屏即览，极简 H5 用户端

只保留核心路径：看直播 → 下单 → 订单追踪。无多余功能，符合 H5 轻量、即开即用的定位。

直播广场
直播广场
发现精彩直播 · 边看边买
我的订单
订单中心
全部 / 待付款 / 待发货 / 售后
个人中心
个人中心
订单 · 地址 · 协议 · 客服
01

直播广场 · 边看边买的入口

H5 端首页即直播广场。双列卡片展示所有直播间，带 LIVE 标识、销售数据、观看人数、主播信息，一眼看清热度，一点进入观看。

直播广场

核心能力

  • LIVE 筛选全部直播 / 正在直播 两个 Tab 快速切换
  • 销售数据卡片直接展示最高在线、销售数据、直播时长，方便用户判断热度
  • 观看人数实时在线人数小标签，一眼识别直播间活跃度
  • 主播标识头像 + 昵称 + 认证标签，快速建立信任感
  • 无限滚动下拉刷新 + 上拉加载更多，触底提示"没有更多了"
双列瀑布流LIVE 实时徽标一键进入直播下拉刷新
02

订单中心 · 5 状态订单追踪

完整订单生命周期管理。全部 / 待付款 / 待发货 / 待收货 / 去售后 五个状态 Tab 筛选，订单卡片展示商品图、规格、价格、数量、实付款金额，支持取消订单、继续支付、申请售后。

订单状态

  • 全部所有订单按创建时间倒序展示
  • 待付款未支付订单，支持"取消订单"/"立即支付"操作
  • 待发货已付款待商家发货，可联系客服
  • 待收货已发货，显示快递单号，可一键确认收货
  • 去售后已完成订单，支持退款 / 退货 / 换货申请
订单编号追踪实付款高亮规格展示一键再下单
订单中心
03

个人中心 · 精简但完整

H5 端个人中心保留电商闭环的全部必要功能：账号信息、我的订单、收货地址、联系客服、常见问题、用户协议、隐私协议、免责声明、意见反馈、关于我们、退出登录。

个人中心

功能分区

  • 账号区头像 + 昵称，点击"编辑"修改资料
  • 宫格菜单我的订单 · 收货地址 · 联系客服 · 常见问题（四大高频入口）
  • 合规协议用户协议 · 隐私协议 · 免责声明（内嵌富文本页面）
  • 反馈通道意见反馈 · 关于我们（含公司信息与版本号）
  • 账号安全退出登录按钮独立放置，防误触
合规齐全点击即达扁平化菜单符合审核规范
观看下单流程

从打开链接到完成支付，5 步闭环

打开链接
微信 / 浏览器直接打开 H5 地址
浏览广场
直播广场选择感兴趣的直播间
观看直播
HLS 拉流 1-3 秒延迟，边看边互动
下单支付
点击商品卡立即下单，微信 H5 支付
订单追踪
订单中心追踪物流，售后一键申请
核心能力

H5 端六大核心特性

浏览器直达

无需安装任何 App，浏览器打开 URL 就能使用，最低门槛触达用户

微信分享裂变

微信内置浏览器完美兼容，支持转发好友、分享朋友圈，天然社交裂变

移动端优先

针对手机屏幕设计，双列卡片、宫格菜单、底部 Tab 栏，纯移动端交互习惯

UniApp 同源

与小程序同一套代码编译产物，修改一处多端同步，开发效率极高

首屏秒开

Vite 打包 + CDN 加速 + 首屏骨架屏，弱网环境下 2 秒内展示

合规完备

用户协议、隐私协议、免责声明齐全，符合应用市场与工信部备案要求

适用场景

H5 端最佳落地场景

扫码看播

线下海报、朋友圈广告扫码直达直播间，无需下载 App

微信分享

群内、朋友圈分享直播链接，一键进入观看下单

流量投放

公众号菜单、短信营销链接落地页，承接外部流量

PC 兼容

电脑浏览器打开也能正常使用，办公室内轻松看播

技术栈

基于UniApp + Vue 3 构建

UniApp
跨端编译 H5
Vue 3
组合式 API
Vite
极速打包
HLS.js
H5 直播拉流
JS-SDK
微信 H5 支付
Nginx
静态托管 + HTTPS

获取完整 H5 端源码 + 其他五端交付

UniApp 工程 · 可直接编译 H5 / 小程序 / App · 免费技术支持

立即购买 查看其他端