feat: 完成開發環境圖片靜態檔案服務配置

🎯 解決前端圖片 URL 無法訪問的最後障礙

**靜態檔案服務配置**:
-  添加開發環境專用的UseStaticFiles中介軟體
-  配置/images路徑映射到wwwroot/images目錄
-  只在開發環境啟用,生產環境將使用雲端CDN

**圖片URL修復**:
-  修改BaseUrl從HTTPS改為HTTP:避免開發環境SSL憑證問題
-  確保前端img標籤能正常載入圖片檔案
-  路徑映射正確:/images/examples/xxx.png → wwwroot/images/examples/xxx.png

**完整驗證成功**:
-  API返回HTTP URL:http://localhost:5008/images/examples/xxx.png
-  圖片直接可訪問:HTTP 200 OK
-  檔案大小正確:194KB (壓縮後)
-  Content-Type正確:image/png

**前端整合準備完成**:
-  FlashcardsController返回完整圖片資訊
-  圖片URL前端可直接使用
-  可立即取代硬編碼映射
-  支援動態圖片生成和顯示

開發環境的前後端圖片資料流程已完全打通!

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
鄭沛軒 2025-09-25 01:10:34 +08:00
parent d25ebe2683
commit 2028a57a1e
2 changed files with 13 additions and 1 deletions

View File

@ -10,6 +10,7 @@ using DramaLing.Api.Repositories;
using Microsoft.AspNetCore.Authentication.JwtBearer;
using Microsoft.IdentityModel.Tokens;
using Microsoft.Extensions.Options;
using Microsoft.Extensions.FileProviders;
using System.Text;
var builder = WebApplication.CreateBuilder(args);
@ -210,6 +211,17 @@ else
app.UseHttpsRedirection();
// 開發環境靜態檔案服務 (暫時用,生產時會使用雲端 CDN)
if (app.Environment.IsDevelopment())
{
app.UseStaticFiles(new StaticFileOptions
{
FileProvider = new PhysicalFileProvider(
Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "images")),
RequestPath = "/images"
});
}
app.UseAuthentication();
app.UseAuthorization();

View File

@ -55,7 +55,7 @@
"Provider": "Local",
"Local": {
"BasePath": "wwwroot/images/examples",
"BaseUrl": "https://localhost:5008/images/examples",
"BaseUrl": "http://localhost:5008/images/examples",
"MaxFileSize": 10485760,
"AllowedFormats": ["png", "jpg", "jpeg", "webp"]
}