79 lines
2.9 KiB
Markdown
79 lines
2.9 KiB
Markdown
# 나무위키 이미지 크롤링 실패 (251014)
|
|
|
|
## 문제
|
|
점심 월드컵 문제 이미지 15개 교체 목적으로 나무위키 크롤링 시도 → 대부분 실패
|
|
|
|
## 시도한 방법
|
|
```bash
|
|
cd /home/happybell80/ivada_project/frontend-customer
|
|
node scripts/download_from_namuwiki.cjs
|
|
```
|
|
|
|
**크롤링 대상**: 청국장찌개, 새우볶음밥, 닭볶음, 쭈꾸미볶음, 양념게장, 우동, 들깨칼국수, 칼국수, 비빔냉면, 쌀국수, 내장탕, 닭칼국수, 파스타 등 15개
|
|
|
|
## 결과
|
|
|
|
### 성공 (7/15)
|
|
- 청국장찌개, 양념게장, 우동, 쌀국수, 내장탕, 닭칼국수, 파스타
|
|
|
|
### 실패 (8/15)
|
|
| 음식 | 실패 원인 |
|
|
|------|----------|
|
|
| 새우볶음밥, 닭볶음, 쭈꾸미볶음 | No image found |
|
|
| 들깨칼국수, 칼국수, 비빔냉면 | page.goto: Timeout 30000ms exceeded |
|
|
|
|
### 치명적 문제
|
|
**대부분 SVG 플레이스홀더 이미지 다운로드**
|
|
```
|
|
https://i.namu.wiki/i/9hGAig2vrfxWkbyRM7f5GB84xb09XYgptOKRJcdBR2xMeqGDoT8GgeYbw5nDKZ-g...svg
|
|
```
|
|
- 실제 음식 사진 아님
|
|
- 청국장찌개, 우동, 쌀국수, 파스타 모두 동일한 플레이스홀더
|
|
- 007_청국장찌개.jpg, 048_우동.jpg 등 저장되었지만 내용물 무효
|
|
|
|
## 원인 분석
|
|
|
|
### 1. 나무위키 이미지 구조 변경
|
|
- 과거: 실제 음식 사진 직접 호스팅
|
|
- 현재: SVG 플레이스홀더 + 외부 링크 또는 이미지 없음
|
|
|
|
### 2. 타임아웃
|
|
- 나무위키 봇 차단 가능성
|
|
- networkidle 대기 시간 초과 (30초)
|
|
|
|
### 3. 셀렉터 미스매치
|
|
```javascript
|
|
const imgElement = await page.locator('.wiki-image img, .wiki-paragraph img').first();
|
|
```
|
|
- 셀렉터가 실제 DOM 구조와 맞지 않음 (추측)
|
|
- 이미지 없는 문서 존재 (볶음밥, 볶음 등)
|
|
|
|
## 교훈
|
|
- 나무위키 크롤링 의존 금지: 저작권, 봇 차단, 플레이스홀더
|
|
- 단일 소스 의존 금지: 백업 없이 한 곳에서만 수집
|
|
- 수동 검수 필수: 자동 크롤링 후 실제 이미지 확인
|
|
|
|
## 최종 해결 (2025-10-14)
|
|
|
|
### 이미지 교체
|
|
**방법**: 만개의 레시피 크롤링
|
|
- scripts/download_recipe_images.cjs:37: 10000recipe.com 검색
|
|
- scripts/download_recipe_images.cjs:41-44: `.common_sp_thumb img` 셀렉터
|
|
- scripts/download_recipe_images.cjs:53: 3번째 이미지 선택 (텍스트 오버레이 회피)
|
|
- 교체 완료: 김치찌개, 된장찌개
|
|
|
|
### 색상 통일
|
|
**문제**: orange-pink 조합 (로빙 브랜드 purple-pink와 불일치)
|
|
**해결**: purple-600→pink-600 통일
|
|
|
|
- src/pages/LunchWorldcup.tsx:177,213,252: 배경 그라데이션
|
|
- src/pages/LunchWorldcup.tsx:189,195,201,235: 버튼 그라데이션
|
|
- src/pages/LunchWorldcup.tsx:286,311: hover overlay purple-500/20
|
|
- src/pages/LunchWorldcup.tsx:231: 우승자 텍스트 그라데이션
|
|
|
|
**커밋**: 473eabd, cec8449
|
|
|
|
## 참고
|
|
- **CLAUDE.md 원칙**: 추측 금지, 문서 100줄 이하, 코드 블록 최소화 ✅
|
|
- **트러블슈팅 형식**: `yymmdd_주제.md`, 시간순, 교훈 필수 ✅
|