yingsa/miniprogram/README-UPLOAD.md
Ethanfly 2ee017bccf feat(branding): Update logo and favicon assets across all platforms
- Replace favicon.svg in admin panel with new brand logo design
- Add logo.png and logo.svg files to dedicated logo directory
- Update miniprogram with new logo assets (logo.png and logo.svg)
- Add README-UPLOAD.md documentation for miniprogram upload functionality
- Update miniprogram app.js and config.js for logo integration
- Update miniprogram user page (pages/user/index.js) to use new branding
- Update server upload route to handle new logo assets
- Add test-upload.js for upload functionality testing
- Update server .env configuration for asset handling
- Standardize brand visual identity across admin, miniprogram, and server platforms
2026-02-03 17:26:02 +08:00

2.8 KiB
Raw Permalink Blame History

小程序头像上传配置说明

问题说明

小程序从本地相册选择头像后,会得到一个临时文件路径(如 http://tmp/xxx.jpg),这个路径需要上传到服务器才能永久保存。

开发环境配置

1. 微信开发者工具设置

在微信开发者工具中,需要开启以下选项:

  1. 点击右上角"详情"
  2. 在"本地设置"中勾选:
    • 不校验合法域名、web-view业务域名、TLS 版本以及 HTTPS 证书
    • 不校验合法域名

这样才能在开发环境中访问 http://127.0.0.1:3001 的上传接口。

2. 确认服务端运行

确保后端服务正在运行:

cd server
npm start

服务应该运行在 http://127.0.0.1:3001

3. 测试上传功能

  1. 在小程序中点击头像
  2. 选择"从相册选择"
  3. 选择一张图片
  4. 点击"保存"
  5. 查看控制台日志,应该显示:

生产环境配置

1. 小程序后台配置

在微信公众平台mp.weixin.qq.com配置合法域名

  1. 登录小程序后台
  2. 进入"开发" -> "开发管理" -> "开发设置"
  3. 在"服务器域名"中配置:
    • uploadFile合法域名https://yingsa-server.ethan.team
    • request合法域名https://yingsa-server.ethan.team
    • socket合法域名wss://yingsa-server.ethan.team

2. 服务端HTTPS配置

确保生产环境服务器已配置HTTPS证书。

常见问题

Q1: 上传失败,提示"不在合法域名列表中"

解决方案

  • 开发环境:在微信开发者工具中开启"不校验合法域名"
  • 生产环境:在小程序后台配置合法的上传域名

Q2: 上传失败,提示"网络错误"

解决方案

  • 检查后端服务是否正常运行
  • 检查 miniprogram/config.js 中的 baseUrl 配置是否正确
  • 查看后端日志是否有错误信息

Q3: 头像显示不出来

解决方案

  • 检查上传是否成功(查看控制台日志)
  • 检查返回的URL是否正确
  • 确认 server/uploads 目录存在且有写入权限
  • 确认服务端的静态文件服务配置正确

Q4: 临时文件路径错误

解决方案

  • 这是正常的,临时文件只在选择时有效
  • 必须上传到服务器后才能永久使用
  • 代码已经处理了临时文件的上传逻辑

调试技巧

查看上传日志

在小程序控制台中查看:

检测到临时头像,开始上传: [临时路径]
上传头像响应: [服务器响应]
头像上传成功: [最终URL]

查看服务端日志

在服务端控制台中查看上传请求和文件保存情况。

检查文件是否保存

检查 server/uploads/ 目录下是否有新上传的文件。