kt-event-marketing-fe/API_CHANGES.md
cherry2250 6cccafa822 AI 이미지 생성 기능 완성 및 실제 API 연동
주요 변경사항:
- Step flow 통합: localStorage 기반 eventId 사용
- 자동 이미지 생성: 이미지 없을 시 자동 생성 트리거
- 진행률 바 추가: 0-100% 진행률 표시
- 동적 로딩 메시지: 단계별 메시지 업데이트
- Next.js 15 API routes 수정: params를 Promise로 처리
- 실제 배포 API 연동: Content API 서버 URL 설정

기술 세부사항:
- API proxy routes 추가 (CORS 우회)
- 2초 폴링 메커니즘 (최대 60초)
- 환경변수: NEXT_PUBLIC_CONTENT_API_URL 설정
- CDN URL 디버그 오버레이 제거

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

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-28 23:08:57 +09:00

264 lines
5.9 KiB
Markdown

# Content API 변경사항
## 📋 주요 변경사항 요약
### 1. **eventDraftId → eventId 타입 변경**
| 항목 | 기존 (Old) | 변경 (New) |
|------|-----------|-----------|
| 필드명 | `eventDraftId` | `eventId` |
| 타입 | `number` | `string` |
| 예시 | `7777` | `"7777"` |
---
## 🔄 영향을 받는 인터페이스
### GenerateImagesRequest
**Before:**
```typescript
interface GenerateImagesRequest {
eventDraftId: number;
eventTitle: string;
eventDescription: string;
industry?: string;
location?: string;
trends?: string[];
styles: ('SIMPLE' | 'FANCY' | 'TRENDY')[];
platforms: ('INSTAGRAM' | 'NAVER' | 'KAKAO')[];
}
```
**After:**
```typescript
interface GenerateImagesRequest {
eventId: string; // Changed from eventDraftId: number
eventTitle: string;
eventDescription: string;
industry?: string;
location?: string;
trends?: string[];
styles: ('SIMPLE' | 'FANCY' | 'TRENDY')[];
platforms: ('INSTAGRAM' | 'NAVER' | 'KAKAO')[];
}
```
### JobInfo
**Before:**
```typescript
interface JobInfo {
id: string;
eventDraftId: number;
jobType: string;
status: 'PENDING' | 'PROCESSING' | 'COMPLETED' | 'FAILED';
progress: number;
resultMessage?: string;
errorMessage?: string;
createdAt: string;
updatedAt: string;
}
```
**After:**
```typescript
interface JobInfo {
id: string;
eventId: string; // Changed from eventDraftId: number
jobType: string;
status: 'PENDING' | 'PROCESSING' | 'COMPLETED' | 'FAILED';
progress: number;
resultMessage?: string;
errorMessage?: string;
createdAt: string;
updatedAt: string;
}
```
### ImageInfo
**Before:**
```typescript
interface ImageInfo {
id: number;
eventDraftId: number;
style: 'SIMPLE' | 'FANCY' | 'TRENDY';
platform: 'INSTAGRAM' | 'NAVER' | 'KAKAO';
cdnUrl: string;
prompt: string;
selected: boolean;
createdAt: string;
updatedAt: string;
}
```
**After:**
```typescript
interface ImageInfo {
id: number;
eventId: string; // Changed from eventDraftId: number
style: 'SIMPLE' | 'FANCY' | 'TRENDY';
platform: 'INSTAGRAM' | 'NAVER' | 'KAKAO';
cdnUrl: string;
prompt: string;
selected: boolean;
createdAt: string;
updatedAt: string;
}
```
### ContentInfo
**Before:**
```typescript
interface ContentInfo {
id: number;
eventDraftId: number;
eventTitle: string;
eventDescription: string;
images: ImageInfo[];
createdAt: string;
updatedAt: string;
}
```
**After:**
```typescript
interface ContentInfo {
id: number;
eventId: string; // Changed from eventDraftId: number
eventTitle: string;
eventDescription: string;
images: ImageInfo[];
createdAt: string;
updatedAt: string;
}
```
---
## 📝 수정된 파일 목록
### 1. Type Definitions
-`src/shared/api/contentApi.ts`
- `GenerateImagesRequest` interface updated
- `JobInfo` interface updated
- `ImageInfo` interface updated
- `ContentInfo` interface updated
- API function signatures updated
### 2. Components
-`src/app/(main)/events/create/steps/ContentPreviewStep.tsx`
- `EventCreationData` interface: `eventDraftId: number``eventDraftId: string`
- Mock data updated to use string type
- API call updated: `eventDraftId``eventId`
### 3. Mock Data Files
-`public/init-mock-data.html`
- `eventDraftId: 7777``eventDraftId: "7777"`
-`MOCK_DATA_SETUP.md`
- All mock data examples updated to string type
- Documentation notes added about type change
### 4. API Routes (Next.js Proxy)
-`src/app/api/content/images/generate/route.ts` (no changes needed)
-`src/app/api/content/images/jobs/[jobId]/route.ts` (no changes needed)
-`src/app/api/content/events/[eventDraftId]/images/route.ts`
- Comment added about eventId parameter
---
## 🧪 테스트 예시
### API 요청 예시
**Before:**
```json
POST /api/v1/content/images/generate
{
"eventDraftId": 7777,
"eventTitle": "맥주 파티 이벤트",
"eventDescription": "강남에서 열리는 신나는 맥주 파티",
"industry": "음식점",
"location": "강남",
"trends": ["파티", "맥주", "생맥주"],
"styles": ["SIMPLE", "FANCY", "TRENDY"],
"platforms": ["INSTAGRAM"]
}
```
**After:**
```json
POST /api/v1/content/images/generate
{
"eventId": "7777",
"eventTitle": "맥주 파티 이벤트",
"eventDescription": "강남에서 열리는 신나는 맥주 파티",
"industry": "음식점",
"location": "강남",
"trends": ["파티", "맥주", "생맥주"],
"styles": ["SIMPLE", "FANCY", "TRENDY"],
"platforms": ["INSTAGRAM"]
}
```
### localStorage Mock 데이터
**Before:**
```javascript
localStorage.setItem('eventCreationData', JSON.stringify({
eventDraftId: 7777,
eventTitle: "맥주 파티 이벤트",
// ...
}));
```
**After:**
```javascript
localStorage.setItem('eventCreationData', JSON.stringify({
eventDraftId: "7777", // String type now
eventTitle: "맥주 파티 이벤트",
// ...
}));
```
---
## ✅ 마이그레이션 체크리스트
- [x] TypeScript 인터페이스 업데이트
- [x] API 호출 코드 수정
- [x] Mock 데이터 타입 변경
- [x] 문서 업데이트
- [x] 빌드 성공 확인
- [ ] 개발 서버 테스트
- [ ] 실제 API 연동 테스트
---
## 🔗 관련 API 문서
- Swagger UI: http://localhost:8084/swagger-ui/index.html
- OpenAPI Spec: http://localhost:8084/v3/api-docs
---
## 📌 주의사항
1. **타입 주의**: `eventId`는 이제 `string` 타입입니다. 숫자로 사용하지 마세요.
2. **Mock 데이터**: localStorage에 저장할 때 문자열 타입으로 저장해야 합니다.
3. **API 호출**: 프론트엔드에서 백엔드로 전송 시 string으로 전송됩니다.
4. **하위 호환성**: 기존 number 타입 데이터는 작동하지 않으므로 localStorage를 초기화해야 합니다.
---
## 🔄 롤백 방법
만약 이전 버전으로 돌아가야 한다면:
1. `git revert` 또는 특정 커밋으로 복원
2. localStorage 초기화: `localStorage.removeItem('eventCreationData')`
3. 개발 서버 재시작