# 環境變數設置指南 (.NET Core 版)

## 📋 前置準備

在開始之前，請確保你已經：
1. 複製 `.env.example` 為前端環境變數
2. 註冊所需的服務帳號
3. 安裝 .NET 8 SDK

```bash
# 前端環境變數
cp .env.example frontend/.env.local

# 後端配置檔案 (不需要 .env，使用 appsettings.json)
# 編輯 backend/DramaLing.Api/appsettings.Development.json
```

## 🔑 環境變數詳細說明

### 1. Supabase 設置

#### 步驟 1: 建立 Supabase 專案
1. 前往 [Supabase Dashboard](https://app.supabase.com)
2. 點擊「New Project」
3. 設定專案名稱：`dramaling-dev`
4. 選擇區域：`Southeast Asia (Singapore)`
5. 設定資料庫密碼並記住

#### 步驟 2: 獲取連接資訊
從 Supabase Dashboard 的 Settings > API 頁面獲取：

**前端配置** (`frontend/.env.local`):
```env
# Supabase 前端配置
NEXT_PUBLIC_SUPABASE_URL=https://your-project-id.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key

# API 服務配置
NEXT_PUBLIC_API_URL=http://localhost:5000
NEXT_PUBLIC_APP_URL=http://localhost:3001
```

**後端配置** (`backend/DramaLing.Api/appsettings.Development.json`):
```json
{
  "ConnectionStrings": {
    "DefaultConnection": "Host=db.your-project-id.supabase.co;Database=postgres;Username=postgres;Password=your-db-password;Port=5432;SSL Mode=Require;"
  },
  "Supabase": {
    "Url": "https://your-project-id.supabase.co",
    "ServiceRoleKey": "your-service-role-key",
    "JwtSecret": "your-jwt-secret"
  }
}
```

#### 步驟 3: 獲取 JWT Secret
1. 在 Supabase Dashboard 前往 Settings > API
2. 複製「JWT Secret」值
3. 貼入後端配置的 `Supabase:JwtSecret`

### 2. Google Gemini AI 設置

#### 步驟 1: 建立 Google Cloud 專案
1. 前往 [Google AI Studio](https://makersuite.google.com/app/apikey)
2. 點擊「Create API Key」
3. 選擇現有專案或建立新專案
4. 複製生成的 API Key

#### 步驟 2: 配置 API Key
**後端配置** (`backend/DramaLing.Api/appsettings.Development.json`):
```json
{
  "AI": {
    "GeminiApiKey": "your-gemini-api-key"
  }
}
```

### 3. 部署環境設置 (未來)

#### 前端部署 (Vercel)
**檔案**: `frontend/.env.local`
```env
NEXT_PUBLIC_API_URL=https://your-dotnet-api.azurewebsites.net
NEXT_PUBLIC_APP_URL=https://your-frontend.vercel.app
```

#### 後端部署 (Azure App Service)
**檔案**: `backend/DramaLing.Api/appsettings.json`
```json
{
  "ConnectionStrings": {
    "DefaultConnection": "從 Azure 環境變數獲取"
  }
}
```

## 🔧 設置驗證

### 前端環境驗證
```bash
cd frontend
npm run dev
# 前端應該在 http://localhost:3001 啟動
```

### 後端環境驗證
```bash
./start-dotnet-api.sh
# 後端應該在 http://localhost:5000 啟動
# Swagger 文檔: http://localhost:5000/swagger
```

### 資料庫連接驗證
```bash
cd backend/DramaLing.Api
dotnet ef database update
# 應該成功連接到 Supabase PostgreSQL
```

## 🚨 常見問題

### .NET SDK 相關
- **問題**: `dotnet: command not found`
- **解決**: 執行 `export PATH="$HOME/.dotnet:$PATH"`

### Supabase 連接
- **問題**: `Npgsql.NpgsqlException: Connection refused`
- **解決**: 檢查 IP 位址是否在 Supabase 白名單中

### JWT 驗證
- **問題**: `401 Unauthorized`
- **解決**: 確認 JWT Secret 配置正確

## 📚 相關文檔

- **[專案結構指南](./folder-structure.md)** - 了解檔案組織
- **[.NET Core 完成計劃](/docs/03_development/dotnet-completion-plan.md)** - 後端實作指南
- **[後端開發計劃](/docs/03_development/api/backend-development-plan.md)** - 整體架構設計

---

**更新時間**: 2025-09-16
**架構版本**: 前後端分離 (.NET Core + Next.js)