51 lines
2.0 KiB
Markdown
51 lines
2.0 KiB
Markdown
# 瞬间 FLOW
|
||
|
||
Next.js Pages Router + React + TypeScript 的抖音风格单页演示。无登录、无数据库、无后端业务接口。
|
||
|
||
## 本地启动
|
||
|
||
Node.js 22，pnpm 10.28.2：
|
||
|
||
```sh
|
||
corepack enable
|
||
pnpm install --frozen-lockfile
|
||
pnpm dev
|
||
```
|
||
|
||
浏览器打开 http://localhost:3000 。手机与电脑自适应：手机全屏触摸上下切换，电脑宽屏播放，支持滚轮、上下方向键及右侧切换按钮。空格暂停，M 切换声音。
|
||
|
||
## 交互
|
||
|
||
- 三段本地 MP4 无限循环切换，单击暂停、双击点赞、拖动进度、静音/开启声音、桌面全屏。
|
||
- 点赞、收藏、关注按视频保存在本机 localStorage，无需账号。
|
||
- 搜索默认数据、标签搜索、分享视频专属链接、评论抽屉及本次会话评论。
|
||
- 其他导航提供演示提示，不包含其他业务页面。
|
||
|
||
## 重新生成视频
|
||
|
||
```sh
|
||
pnpm generate:videos
|
||
```
|
||
|
||
`scripts/generate-videos.mjs` 使用 Canvas 绘图和 FFmpeg 生成日落、海岸、霓虹三段 8 秒 H.264/AAC 视频及封面。无外部素材下载；成品已提交，正常构建和运行无需 FFmpeg。音轨为程序生成的轻声合成音，初始静音。
|
||
|
||
## 检查与构建
|
||
|
||
```sh
|
||
pnpm typecheck
|
||
pnpm build
|
||
pnpm start
|
||
```
|
||
|
||
## Docker 持久化部署
|
||
|
||
```sh
|
||
docker compose up -d --build --wait
|
||
```
|
||
|
||
默认发布到宿主机 `18080` 端口，可用 `PUBLIC_PORT` 覆盖。容器以非 root 用户运行，具有健康检查、日志轮转及 `unless-stopped` 重启策略。
|
||
|
||
推送 main 触发 `.gitea/workflows/deploy.yml`，使用 `ces-control` 标签 runner 构建并部署。该 runner 必须能访问目标宿主机 Docker daemon 并具备 Compose v2；安全组需允许公网访问所选端口。运行持久性由宿主机 Docker 提供，runner 任务结束不会删除应用容器。若同标签有多个 runner，应由管理员保证标签指向预期部署主机。
|
||
|
||
后续更新：提交并推送 main 即可。镜像保留提交 SHA 标签，可用 `IMAGE_TAG=<旧提交SHA> docker compose up -d --no-build` 回滚到该宿主机已保留的镜像。
|