58 lines
2.9 KiB
Markdown
58 lines
2.9 KiB
Markdown
---
|
||
name: 修复用户头像上传
|
||
overview: 前端「编辑资料」头像选择当前只保存微信临时文件路径，未调用后端头像上传接口，导致头像不可用。修复为：选择头像后预览，保存时先调用 POST /user/avatar/upload 上传，再更新资料。
|
||
todos:
|
||
- id: extend-upload-file
|
||
content: 扩展 uploadFile 支持自定义上传 url（默认 /clothes/upload）
|
||
status: completed
|
||
- id: fix-avatar-save
|
||
content: 重构 profile 保存流程：先上传头像再保存资料
|
||
status: completed
|
||
dependencies:
|
||
- extend-upload-file
|
||
- id: update-profile-ui
|
||
content: 更新编辑弹窗上传中状态与禁用样式
|
||
status: completed
|
||
dependencies:
|
||
- fix-avatar-save
|
||
---
|
||
|
||
# 修复头像上传与获取链路
|
||
|
||
## 产品概述
|
||
|
||
修复「我的」页面头像上传不可用问题，并一并修复头像获取链路的两处隐患（分享者头像 URL 转换、前端缓存时效），使头像上传与展示均正确且持久生效。
|
||
|
||
## 核心功能
|
||
|
||
- 选择新头像后正常上传并持久保存，与昵称/性别/生日一并生效。
|
||
- 分享场景分享者头像（owner_avatar）正确转换，不再生成错误 URL。
|
||
- 前端头像展示不再因缓存过期签名 URL 而失效。
|
||
|
||
## 技术栈
|
||
|
||
- 小程序：原生 TypeScript，复用 `request` / `uploadFile`。
|
||
- 后端：Go，复用 `pkg/upload` 与既有 service 层。
|
||
|
||
## 实现方案
|
||
|
||
### 一、上传修复（前端）
|
||
|
||
- `utils/request.ts`：`uploadFile` 增加可选 `url` 参数（默认 `/clothes/upload`），保持衣物上传调用方零改动。
|
||
- `pages/profile/profile.ts`：新增 `avatarUploading` 状态；`onSaveProfile` 判断头像为临时路径（非 `http://`/`https://` 开头）时，先调 `/user/avatar/upload`（字段名 `file`，响应 `{ avatar }`），成功后再 PUT `/user/profile`（body 仅含 username/sex/birth_day，不含 avatar）。
|
||
- `pages/profile/profile.wxml` + `wxss`：保存按钮在上传中显示「上传中…」并禁用。
|
||
|
||
### 二、后端头像 URL 转换统一
|
||
|
||
- `pkg/upload/upload.go`：新增 `AvatarURL(raw string) string`——空串返回空；`http://`/`https://` 开头直接透传；否则 `GetCosUrl`。
|
||
- `internal/service/user.go`：`buildUserInfoResponse` 改用 `upload.AvatarURL`。
|
||
- `internal/service/closet.go`：详情与列表两处 owner_avatar 改用 `upload.AvatarURL`，删除无条件 `GetCosUrl`。
|
||
|
||
### 三、前端缓存时效修复
|
||
|
||
- `pages/closet-share-create/closet-share-create.ts`：`onLoad` 先读本地缓存兜底，再请求 `/user/info` 实时刷新昵称与头像并回写缓存（签名 URL 带 `t` 时间戳，缓存会过期）。
|
||
|
||
## 目录结构
|
||
|
||
- 前端：`miniprogram/utils/request.ts`、`pages/profile/{profile.ts,profile.wxml,profile.wxss}`、`pages/closet-share-create/closet-share-create.ts`
|
||
- 后端：`pkg/upload/upload.go`、`internal/service/user.go`、`internal/service/closet.go` |