docs: 구스팜 블로그 시리즈 API 요청 미실행 문제 트러블슈팅 문서 추가
This commit is contained in:
parent
b833883f9f
commit
25b8dff334
134
journey/troubleshooting/251223_blog_series_api_not_executing.md
Normal file
134
journey/troubleshooting/251223_blog_series_api_not_executing.md
Normal file
@ -0,0 +1,134 @@
|
||||
# 블로그 시리즈 API 요청이 브라우저에서 실행되지 않는 문제
|
||||
|
||||
**날짜**: 2025-12-23
|
||||
**작성자**: Claude (AI)
|
||||
**태그**: `frontend`, `backend`, `api`, `troubleshooting`, `wikidocs-blog`
|
||||
**상태**: 🔴 미해결
|
||||
|
||||
---
|
||||
|
||||
## 문제 상황
|
||||
|
||||
블로그 목록 페이지(`/goosefarm/blog`)에 시리즈(책) 섹션을 추가하려고 시도했으나, 시리즈 API 요청이 브라우저에서 실행되지 않는 문제 발생.
|
||||
|
||||
- 시리즈 API는 정상 작동 (curl 테스트 통과)
|
||||
- 시리즈 섹션이 표시되지 않음
|
||||
- 브라우저 네트워크 탭에 `/goosefarm/api/books` 요청이 나타나지 않음
|
||||
|
||||
---
|
||||
|
||||
## 확인된 사항
|
||||
|
||||
### ✅ 정상 작동하는 부분
|
||||
|
||||
1. **시리즈 API 정상 작동**
|
||||
- `curl https://ro-being.com/goosefarm/api/books` → HTTP 200
|
||||
- 데이터 정상 반환: `{"items": [{"id": "...", "title": "점프 투 파이썬", ...}], "total": 1}`
|
||||
|
||||
2. **백엔드 라우터 등록 확인**
|
||||
- `book.router`가 `app.py`에 포함됨
|
||||
- 라우터 경로: `/api/books`
|
||||
|
||||
3. **빌드된 파일에 코드 포함**
|
||||
- `/var/www/html/goosefarm/assets/*.js`에 "api/books" 문자열 확인
|
||||
- 빌드 및 배포 완료
|
||||
|
||||
4. **프론트엔드 코드 수정 완료**
|
||||
- `BlogPage.tsx`에 시리즈 fetch 로직 추가
|
||||
- 시리즈 섹션 렌더링 코드 포함
|
||||
|
||||
### ❌ 문제가 있는 부분
|
||||
|
||||
1. **브라우저에서 API 요청이 실행되지 않음**
|
||||
- 네트워크 탭에 `/goosefarm/api/books` 요청 없음
|
||||
- 브라우저 콘솔에 디버깅 로그 없음
|
||||
|
||||
2. **시리즈 섹션이 표시되지 않음**
|
||||
- `books.length > 0` 조건이 false
|
||||
- 시리즈 포스트들이 개별 포스트로 표시됨
|
||||
|
||||
---
|
||||
|
||||
## 시도한 해결 방법
|
||||
|
||||
1. **코드 단순화**
|
||||
- async/await → Promise.then()으로 변경
|
||||
- 독립적인 fetch 함수를 직접 호출로 변경
|
||||
|
||||
2. **디버깅 로그 추가**
|
||||
- `console.log('Fetching books...')` 추가
|
||||
- `console.log('BlogPage useEffect 실행됨')` 추가
|
||||
- 컴포넌트 렌더링 로그 추가
|
||||
|
||||
3. **로딩 상태 관리 개선**
|
||||
- `booksLoaded`, `blogsLoaded` 플래그 추가
|
||||
- 두 요청 완료 후 로딩 해제
|
||||
|
||||
4. **빌드 및 배포**
|
||||
- 여러 번 재빌드 및 배포 시도
|
||||
- 빌드된 파일 확인
|
||||
|
||||
5. **브라우저 새로고침**
|
||||
- 일반 새로고침 (F5)
|
||||
- 강제 새로고침 (Ctrl+F5)
|
||||
|
||||
---
|
||||
|
||||
## 현재 상태
|
||||
|
||||
- **코드**: 정상 (시리즈 fetch 로직 포함)
|
||||
- **API**: 정상 작동
|
||||
- **브라우저 실행**: 시리즈 API 요청이 실행되지 않음
|
||||
- **원인**: 미확인 (브라우저 캐시/콘솔 필터/코드 실행 순서 문제 가능)
|
||||
|
||||
---
|
||||
|
||||
## 기술적 세부사항
|
||||
|
||||
### API 엔드포인트
|
||||
- 시리즈 목록: `GET /goosefarm/api/books`
|
||||
- 시리즈 상세: `GET /goosefarm/api/books/{id}` (첫 번째 포스트 ID 조회용)
|
||||
|
||||
### 필터링 로직
|
||||
- `!post.book_id`로 시리즈에 속하지 않은 포스트만 표시
|
||||
- 시리즈 포스트는 시리즈 섹션에 표시
|
||||
|
||||
### 로딩 상태 관리
|
||||
- `booksLoaded`, `blogsLoaded` 플래그로 두 요청 완료 후 로딩 해제
|
||||
- `isMounted` 플래그로 컴포넌트 언마운트 후 상태 업데이트 방지
|
||||
|
||||
---
|
||||
|
||||
## 관련 파일
|
||||
|
||||
- **프론트엔드**: `/home/admin/goosefarminvesting/frontend/src/pages/BlogPage.tsx`
|
||||
- **백엔드 라우터**: `/home/admin/goosefarminvesting/backend/src/goosefarm/routers/book.py`
|
||||
- **백엔드 앱**: `/home/admin/goosefarminvesting/backend/src/goosefarm/app.py`
|
||||
|
||||
---
|
||||
|
||||
## 다음 단계 제안
|
||||
|
||||
1. **브라우저 개발자 도구 확인**
|
||||
- 콘솔 필터 설정 확인 (모든 로그 표시)
|
||||
- 네트워크 탭에서 `/goosefarm/api/books` 요청 존재 여부 확인
|
||||
|
||||
2. **브라우저 캐시 문제 해결**
|
||||
- 강제 새로고침 (Ctrl+Shift+R 또는 Cmd+Shift+R)
|
||||
- 브라우저 캐시 삭제
|
||||
|
||||
3. **직접 테스트**
|
||||
- 브라우저 콘솔에서 직접 `fetch('/goosefarm/api/books')` 실행 테스트
|
||||
- React DevTools로 컴포넌트 상태 확인
|
||||
|
||||
4. **코드 실행 순서 확인**
|
||||
- useEffect가 실제로 실행되는지 확인
|
||||
- fetch 호출이 실행되는지 확인
|
||||
|
||||
---
|
||||
|
||||
## 참고
|
||||
|
||||
- 기존 트러블슈팅 문서: `251104_blog_system_implementation.md`
|
||||
- 위키독스 블로그 구현 계획: `250123_위키독스_블로그_구현계획.md`
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user