!47 fix: 修复前端无法加载七牛云图片的问题

Merge pull request !47 from 何朝晖/fix/show-img

backend/internal/handler/generate.go

@@ -36,6 +36,7 @@ type GenerateResponse struct {
 
 // AssetResponse 单个素材响应。
 type AssetResponse struct {
+	Key    string `json:"key"`
 	URL    string `json:"url"`
 	Format string `json:"format"`
 }
@@ -156,6 +157,7 @@ func runPipelineBg(projectID, taskID string, req GenerateRequest) {
 			return
 		}
 		assets[i] = AssetResponse{
+			Key:    key,
 			URL:    cdnURL,
 			Format: a.Format,
 		}

backend/internal/service/storage.go

@@ -94,5 +94,9 @@ func (s *StorageService) Delete(ctx context.Context, key string) error {
 // buildURL 根据配置构建完整的 CDN URL。
 func (s *StorageService) buildURL(key string) string {
 	host := strings.TrimRight(s.cfg.CDNHost, "/")
-	return fmt.Sprintf("%s/%s", host, url.PathEscape(key))
+	segments := strings.Split(key, "/")
+	for i, seg := range segments {
+		segments[i] = url.PathEscape(seg)
+	}
+	return fmt.Sprintf("%s/%s", host, strings.Join(segments, "/"))
 }

docs/api.md

@@ -483,8 +483,8 @@ POST /api/v1/prompt/optimize
   "data": {
     "assets": [
       {
-        "id": "asset_001",
-        "url": "https://cdn.example.com/users/user_a1B2c3D4/projects/proj_abc123/tasks/task_xyz789/output/spritesheet.png",
+        "key": "generation/proj_abc123/task_xyz789/0.png",
+        "url": "https://cdn.example.com/generation/proj_abc123/task_xyz789/0.png",
         "format": "png",
         "width": 256,
         "height": 64,
@@ -500,9 +500,15 @@ POST /api/v1/prompt/optimize
 }
 ```
 
+| 字段 | 类型 | 说明 |
+|------|------|------|
+| `key` | string | 七牛云对象存储 Key |
+| `url` | string | CDN 直接访问 URL |
+| `format` | string | 图片格式（png 等） |
+
 ### GET /api/v1/assets/download
 
-需认证。返回 302 重定向到七牛云 CDN URL。
+公开接口（无需认证）。返回 302 重定向到七牛云 CDN URL。前端可通过此接口加载素材图片，作为 CDN 直接访问的替代方案。
 
 | 参数 | 类型 | 说明 |
 |------|------|------|

frontend/src/api/generate.ts

@@ -21,7 +21,8 @@ export async function getAssets(taskId: string): Promise<Asset[]> {
   const resp = await get<AssetsResponse>(`/api/v1/tasks/${taskId}/assets`)
   return resp.assets.map((a, i) => ({
     id: `asset-${i}`,
-    url: a.url,
+    key: a.key,
+    url: `/api/v1/assets/download?key=${encodeURIComponent(a.key)}`,
     format: a.format,
     width: resp.metadata.frameWidth,
     height: resp.metadata.frameHeight,

frontend/src/api/types.ts

@@ -79,6 +79,7 @@ export interface Task {
 // 素材
 export interface Asset {
   id: string
+  key: string
   url: string
   format: string
   width: number
@@ -114,6 +115,7 @@ export interface GenerateResponse {
 // 素材列表响应 — 对应 GET /api/v1/tasks/:taskId/assets
 export interface AssetsResponse {
   assets: {
+    key: string
     url: string
     format: string
   }[]