From 25b8dff334ac1c7d944ba7a39f12824c531f7d2f Mon Sep 17 00:00:00 2001 From: happybell80 Date: Tue, 23 Dec 2025 17:35:35 +0900 Subject: [PATCH] =?UTF-8?q?docs:=20=EA=B5=AC=EC=8A=A4=ED=8C=9C=20=EB=B8=94?= =?UTF-8?q?=EB=A1=9C=EA=B7=B8=20=EC=8B=9C=EB=A6=AC=EC=A6=88=20API=20?= =?UTF-8?q?=EC=9A=94=EC=B2=AD=20=EB=AF=B8=EC=8B=A4=ED=96=89=20=EB=AC=B8?= =?UTF-8?q?=EC=A0=9C=20=ED=8A=B8=EB=9F=AC=EB=B8=94=EC=8A=88=ED=8C=85=20?= =?UTF-8?q?=EB=AC=B8=EC=84=9C=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../251223_blog_series_api_not_executing.md | 134 ++++++++++++++++++ 1 file changed, 134 insertions(+) create mode 100644 journey/troubleshooting/251223_blog_series_api_not_executing.md diff --git a/journey/troubleshooting/251223_blog_series_api_not_executing.md b/journey/troubleshooting/251223_blog_series_api_not_executing.md new file mode 100644 index 0000000..606cab6 --- /dev/null +++ b/journey/troubleshooting/251223_blog_series_api_not_executing.md @@ -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` +