all_user/web_huakui_web
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

样式修改

Browse Source
This commit is contained in:
谢宇宁
2026-10-16 14:10:10 +07:00
parent d2ddb1c321
commit 4afd5f9143
42 changed files with 89 additions and 1765 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+14 -14
View File
@@ -1,6 +1,6 @@
# 花魁短剧 · Next.js / TypeScript
从 `jha-1045-hgdjnet-web` 迁移的独立 Next.js 16 项目。运行时仅需要 Node.js，不依赖 Go、原项目目录或原 Go 服务。保留内容浏览页面、原 URL、游客会话、播放器和统计交互（登录、账户与充值功能已移除，旧账户地址 301 到首页）；PC/H5 界面按花魁短剧 Figma 设计更新。
从 `jha-1045-hgdjnet-web` 迁移的独立 Next.js 16 项目。运行时仅需要 Node.js，不依赖 Go、原项目目录或原 Go 服务。保留内容浏览页面、原 URL、游客会话和播放器（登录、账户与充值功能已移除，旧账户地址 301 到首页）；PC/H5 界面按花魁短剧 Figma 设计更新。
## 启动
@@ -68,20 +68,18 @@ Node 原生代理说明：[Node.js HTTP 文档](https://nodejs.org/download/rele
配置优先级：进程环境变量 > `config/<环境>.local.env` > `config/<环境>.env`。本地覆盖文件不会提交。`APP_ENV` 选择业务环境；测试环境的优化构建仍使用 Next.js 要求的 `NODE_ENV=production`。
开发 `UPSTREAM_API_URL` 使用 `http://172.104.181.99:30331`；测试服务与 API 同机，使用 `http://127.0.0.1:30331`，测试应用端口为 `30334`。本地运行测试环境且 API 不在本机时，可在 `config/test.local.env` 覆盖上游地址。正式配置使用同机 API `http://127.0.0.1:26931`、服务端口 `26935`，可由部署环境或 `config/production.local.env` 覆盖。构建不访问上游，启动时检查地址。
开发 `UPSTREAM_API_URL` 使用 `https://webhuakuiapi.mfcg.me`；测试服务与 API 同机，使用 `http://127.0.0.1:30331`，测试应用端口为 `30334`。本地运行测试环境且 API 不在本机时，可在 `config/test.local.env` 覆盖上游地址。正式配置使用同机 API `http://127.0.0.1:26931`、服务端口 `26935`，可由部署环境或 `config/production.local.env` 覆盖。构建不访问上游，启动时检查地址。
```dotenv
UPSTREAM_API_URL=https://your-api.example
UPSTREAM_TIMEOUT_MS=20000
IMAGE_CDN_URL=
SITEMAP_DIR=../template/pages/sitemaps
TRACKER_APP_ID=JHA-4001
TRACKER_ENCRYPTED_CONFIG=
```
这些变量仅供服务端使用。`config/info.reportSdkConfig` 优先于本地埋点密文配置。官方导航独立进程可以使用 `NAVIGATION_ONLY=true PORT=26813 npm start`，开放 `/`、`/navigation/` 和静态资源，原 `/nav/`、`/dh/` 一次 301 到 `/navigation/`。与原 Go `DHInit` 一致，导航模式不注册 robots、llms、sitemap、验证文件及业务接口，这些地址返回原站 404 页面。
这些变量仅供服务端使用。官方导航独立进程可以使用 `NAVIGATION_ONLY=true PORT=26813 npm start`，开放 `/`、`/navigation/` 和静态资源，原 `/nav/`、`/dh/` 一次 301 到 `/navigation/`。与原 Go `DHInit` 一致，导航模式不注册 robots、llms、sitemap、验证文件及业务接口，这些地址返回原站 404 页面。
图片 CDN 与 API 独立配置。上游 `config/info.config.imgCdn`、`imgAppUsCdn` 按顺序提供图片来源，`IMAGE_CDN_URL` 提供环境级备用来源。开发与测试共用 API 30331，该接口返回裸 `v3/image/...` 且 CDN 配置为空，因此两套环境均显式配置原站已验证可用的 CloudFront 图片线路；生产独立配置。修改环境配置后需重启服务。
图片 CDN 与 API 独立配置。上游 `config/info.config.imgCdn`、`imgAppUsCdn` 按顺序提供图片来源，`IMAGE_CDN_URL` 提供环境级备用来源。开发 API 返回 `imgCdn`/`imgAppUsCdn`；测试 API 30331 返回裸 `v3/image/...` 且 CDN 配置为空，因此两套环境均显式配置原站已验证可用的 CloudFront 图片线路作为备用；生产独立配置。修改环境配置后需重启服务。
公共图片组件统一解析相对路径，覆盖封面、横幅、背景和头像；相对路径不会随页面目录变化。图片保持原首 100 字节 XOR 协议，也兼容未加密的有效图片；校验文件头后才缓存，HTTP、证书、JSON 错误或超时会尝试配置的备用 CDN。完整外域 URL 保持原签名，只有属于已配置 CDN 的资源才允许切换相同对象路径；图片请求不向外域发送本站 Cookie/Authorization。
@@ -91,15 +89,15 @@ TRACKER_ENCRYPTED_CONFIG=
| --- | --- |
| `src/app/` | 原生 App Router TSX 页面、Metadata 与 BFF/媒体 Route Handlers |
| `src/features/` | 短剧目录、播放、账号与内容页面组件 |
| `src/components/` | 页头、页尾、卡片、播放器、图片、弹窗、认证、支付、埋点共用组件 |
| `src/components/` | 页头、页尾、卡片、播放器、图片、弹窗、认证、支付共用组件 |
| `src/styles/` | 基础、公共组件、页面和 PWA 覆盖样式，通过 TSX 导入并由 Next 编译 |
| `src/lib/` | 类型化浏览器请求、Cookie、搜索/展示方法与埋点上下文 |
| `src/lib/` | 类型化浏览器请求、Cookie、搜索/展示方法 |
| `src/proxy.ts`、`src/server/react/` | SSR 数据、状态、响应 Cookie 和 React 数据交接 |
| `src/server/pages/` | 原路由参数、分页、页面数据组合与播放/账号场景 |
| `src/server/services/` | 上游 DTO、展示模型、公共配置和请求级复用 |
| `src/server/upstream.ts`、`auth.ts` | 上游请求、请求头/Cookie 透传、登录与游客恢复 |
| `src/server/seo/` | 原 SEO 策略、TDK、canonical、JSON-LD 和抓取文件 |
| `public/static/` | 本地 Figma 品牌/图标、分享图与私有埋点 SDK |
| `public/static/` | 本地 Figma 品牌/图标、分享图 |
所有业务页面由 TSX 组件服务端渲染，交互使用 React hooks 和 Client Components。App Router 的 `generateMetadata` 输出完整首屏 SEO；JSON-LD 使用安全序列化的独立脚本。没有 HTML 模板运行时或注入整页 HTML 的适配层。
@@ -206,7 +204,7 @@ SSR 在 Proxy 中完成上游数据、游客恢复和 Cookie 写回，再交给
公共配置可短期复用；登录用户内容仅在单次请求内复用，页面响应使用 `private, no-store`。必要内容接口临时不可用返回 503、`Retry-After` 和 noindex；真实缺失的实体及越界分页仍返回 404。
播放器通过 `package.json` 管理 `xgplayer`、`xgplayer-hls`，按需加载官方模块和样式，支持 MP4/HLS、加密密钥、预告切换、章节播放、全屏、解锁、评论及播放埋点。原 DPlayer、全局 Hls 和浏览器业务 JS 已删除。加密图片、二维码分别封装为 TSX 组件，二维码使用 npm `qrcode`；占位图 Logo 透明度保持 0.2。
播放器通过 `package.json` 管理 `xgplayer`、`xgplayer-hls`，按需加载官方模块和样式，支持 MP4/HLS、加密密钥、预告切换、章节播放、全屏、解锁及评论。原 DPlayer、全局 Hls 和浏览器业务 JS 已删除。加密图片、二维码分别封装为 TSX 组件，二维码使用 npm `qrcode`；占位图 Logo 透明度保持 0.2。
## SEO 保留范围
@@ -217,7 +215,7 @@ SSR 在 Proxy 中完成上游数据、游客恢复和 Cookie 写回，再交给
- Organization、WebSite、WebPage、Breadcrumb、ItemList、FAQ、TVSeries/TVEpisode、VideoObject 等原 JSON-LD 条件和真实元数据。
- robots.txt、llms.txt、sitemap 索引/分片、纯渠道首页 302、下载地址 302。
上游 TDK、导航、公告和 JSON-LD 中的完整旧品牌词「黄果短剧」统一显示为「花魁短剧」。永久域名、canonical、真实联系地址、普通影片名称、验证值和 SDK 配置保留原值。
上游 TDK、导航、公告和 JSON-LD 中的完整旧品牌词「黄果短剧」统一显示为「花魁短剧」。永久域名、canonical、真实联系地址、普通影片名称、验证值保留原值。
抓取文件遵循原 Go 路由。普通站点的 robots/llms 读取公共配置，保留 60 秒成功缓存；刷新失败沿用最近成功配置，首次失败使用空配置。地址使用原永久域名优先、代理协议/Host 回退规则。robots 按顺序读取 `template/pages/robots.txt`、`templates/pages/robots.txt`、`app/template/pages/robots.txt`、`app/templates/pages/robots.txt`，没有可用文件时使用原内嵌文本，再回退原内置默认文本。保留原爬虫规则、行处理、已有 Host 和大小写语义，按原算法写入 Sitemap 地址。
@@ -263,11 +261,13 @@ APP_ANDROID_APK_URL=
APP_DEEP_LINK_URL=
```
平台地址未配置时，按钮显示“前往下载页”，沿用上游 `AppAddr` 或 `/app/download/` 跳转；未配置 App 深链时隐藏打开 App 入口。链接保留原始跳转地址与导航埋点，不生成设计示例中的安装包、描述文件或 App Store 地址。
平台地址未配置时，按钮显示“前往下载页”，沿用上游 `AppAddr` 或 `/app/download/` 跳转；未配置 App 深链时隐藏打开 App 入口。链接保留原始跳转地址，不生成设计示例中的安装包、描述文件或 App Store 地址。
所有 Telegram 联系入口（页尾、官方导航、回家的路、播放页链接、2257/DMCA、意见反馈，以及 Telegram 形式的「联系我们」客服链接）统一使用 `CONTACT_TELEGRAM_URL`，三套环境默认 `https://t.me/jbd125`，覆盖上游 `tgGroup`、`telegram`、`telegramAdd`。值无效时回退为默认账号。
## 接口和媒体
保留原 BFF 路由、别名、参数校验、业务响应壳、上传和 CSV 导出。`Cookie`、cookie token 优先的 `Authorization`、客户端 IP、浏览器 UA、`X-User-Agent`、`X-SDK-Common` 透传；过滤 hop-by-hop 和内部控制头。多个 `Set-Cookie` 独立回传。埋点上下文按原白名单校验并保留 SDK 原字段。
保留原 BFF 路由、别名、参数校验、业务响应壳、上传和 CSV 导出。`Cookie`、cookie token 优先的 `Authorization`、客户端 IP、浏览器 UA、`X-User-Agent` 透传；过滤 hop-by-hop 和内部控制头。多个 `Set-Cookie` 独立回传。
公共配置隔离过期登录凭证；个人资料刷新与游客恢复写回当前请求，避免首屏重复建立会话。正式账号失效和内容允许降级游客的规则分别保留。
@@ -289,7 +289,7 @@ SMOKE_URL=http://localhost:25131 npm run test:browser
SMOKE_URL=http://localhost:25131 npm run test:ui
```
浏览器检查默认使用 macOS Chrome，可通过 `CHROME_PATH` 指定。`test:catalog`、`test:popups`、`test:playback` 使用隔离上游与真实 React 组件，验证目录交互、弹层焦点/滚动、官方 xgplayer、加密 HLS、评论与埋点，不改动真实账号。`test:ssr` 使用生产构建核验 SEO、HTTP 状态、Cookie、透传和并发隔离，不访问真实业务接口。
浏览器检查默认使用 macOS Chrome，可通过 `CHROME_PATH` 指定。`test:catalog`、`test:popups`、`test:playback` 使用隔离上游与真实 React 组件，验证目录交互、弹层焦点/滚动、官方 xgplayer、加密 HLS 与评论，不改动真实账号。`test:ssr` 使用生产构建核验 SEO、HTTP 状态、Cookie、透传和并发隔离，不访问真实业务接口。
全站界面截图默认输出 `/tmp/hkdj-figma/implementation`，浏览器基础检查输出 `/tmp/hkdj-browser-smoke`。完整真实内容回归需要原上游剧集、专题与标签数据；空环境可设置 `UI_ALLOW_EMPTY_CONTENT=1`，缺失实体仍必须返回 404 与 noindex。