댓글 5
-
이
이온디 2025.12.06 01:32
eb_api 카테고리 필터링 원리 전체 흐름 1. 사용자가 카테고리 버튼 클릭 ↓ 2. React (CategoryFilter.tsx) - 상태 변경 & URL 업데이트 ↓ 3. BoardList.tsx - API URL 생성 ↓ 4. .htaccess - URL 라우팅 ↓ 5. rest.php - 카테고리 파라미터를 category_srl로 변환 ↓ 6. Rhymix getDocumentList() - DB에서 해당 카테고리 글만 조회 상세 설명 1. CategoryFilter.tsx:66-79 - 카테고리 클릭 시: const handleCategoryClick = (categorySrl: number | null) => { // React 상태 변경 onChange(categorySrl) // URL 업데이트 (페이지 새로고침 없이) const newUrl = categorySrl !== null ? `/${mid}/category/${categorySrl}` : `/${mid}` window.history.pushState({ view: 'list', category: categorySrl }, '', newUrl) } 2. BoardList.tsx:93-97 - 카테고리 상태에 따라 API URL 생성: const apiUrl = selectedCategory ? `/api/boards/${config.mid}?page=${page}&category=${selectedCategory}` : `/api/boards/${config.mid}?page=${page}` 3. .htaccess:6 - URL 라우팅 ([QSA]로 쿼리스트링 전달): RewriteRule ^api/boards/([a-zA-Z0-9_-]+)/?$ modules/api/rest.php?type=list&mid=$1 [L,QSA] → /api/boards/blog?category=12345 → rest.php?type=list&mid=blog&category=12345 4. rest.php:916-919 - 카테고리 파라미터 변환: // 카테고리 if (!empty($_GET['category'])) { $doc_args->category_srl = $_GET['category']; } 5. Rhymix Core - getDocumentList()가 category_srl 조건으로 DB 쿼리: SELECT * FROM rx_documents WHERE module_srl = {module_srl} AND category_srl = {category_srl} -- 이 조건이 추가됨 ORDER BY list_order ASC 핵심 포인트 1. SPA 방식: 페이지 새로고침 없이 history.pushState()로 URL만 변경 2. SWR 캐싱: API URL이 변경되면 자동으로 새 데이터 fetch 3. 파라미터 변환: 프론트엔드 category → 백엔드 category_srl로 매핑
-
이
이온디 2025.12.06 01:35
api에서 https://eond.com/blog/category/163367 이렇게 지원하는게 아니라, CategoryFilter.tsx:66-79에서 URL에서 카테고리값이 있는 경우, api에서 BoardList.tsx:93-97에서 직접 api/board/${config.mid}?page=${page}&category=${selectedCategory}로 필터링해서 출력해주는거구나?
-
이
이온디 2025.12.06 01:35
맞습니다. 실제 동작 방식 URL: /blog/category/163367 ↓ (서버는 이 URL을 직접 해석하지 않음) ↓ React SPA가 URL에서 카테고리 값 추출 ↓ API 호출: /api/boards/blog?category=163367 BoardList.tsx:37-53 - URL에서 카테고리 값 추출: const getCategoryFromUrl = (): number | null => { // 1. 쿼리스트링에서 확인 (?category=123) const params = new URLSearchParams(window.location.search) const categoryParam = params.get('category') if (categoryParam) { return parseInt(categoryParam, 10) } // 2. URL 경로에서 확인 (/blog/category/123) const pathname = window.location.pathname const categoryMatch = pathname.match(/\/category\/(\d+)/) if (categoryMatch) { return parseInt(categoryMatch[1], 10) // ← 여기서 163367 추출 } return null } 요약 | 구분 | 내용 | |-----------|---------------------------------------------------| | URL | /blog/category/163367 (사용자에게 보여주는 용도) | | 실제 API 호출 | /api/boards/blog?category=163367 | | 서버 라우팅 | /blog/category/163367 → 그냥 게시판 페이지 로드 (list.html) | | 필터링 주체 | React (클라이언트) | 서버는 /blog/category/163367 URL을 특별히 처리하지 않고, 그냥 게시판 스킨(list.html)을 보여주면 React가 알아서 URL 파싱 → API 호출 → 필터링된 목록 표시를 합니다.
-
이
이온디 2025.12.06 01:37
/blog/category/163367 이런식으로직접 api에서 제공하지 않았던 이유가 혹시 /page/ 때문이었나? 왜 때문이었지. {$mid}/category/123/page/1 이런 구조도 가능할거 같은데..
-
이
이온디 2025.12.06 01:40
아, 이미 .htaccess에 다 있네요! 현재 .htaccess 라우팅 (이미 지원됨) | URL 패턴 | 변환 | |------------------------------|-------------------------------------------| | /blog/category/163367 | index.php?mid=blog&category=163367 | | /blog/category/163367/page/2 | index.php?mid=blog&category=163367&page=2 | 그런데 API 라우팅에는 카테고리가 없음: # 현재 API 라우팅 ^api/boards/{mid}/page/{page} ✅ ^api/boards/{mid}/{document_srl} ✅ ^api/boards/{mid} ✅ # 없는 것 ^api/boards/{mid}/category/{category} ❌ ^api/boards/{mid}/category/{category}/page/{page} ❌ 왜 API에 카테고리 라우팅을 안 넣었을까? 1. 쿼리스트링으로 충분: ?category=123&page=2 방식이 더 유연함 2. URL 조합 복잡성: /category/123/page/2/sort/regdate/order/desc 이런 식으로 늘어남 3. REST 관례: 필터링은 보통 쿼리스트링으로 처리 하지만 추가하려면 간단합니다: # .htaccess에 추가하면 됨 RewriteRule ^api/boards/([a-zA-Z0-9_-]+)/category/([0-9]+)/?$ modules/api/rest.php?type=list&mid=$1&category=$2 [L,QSA] RewriteRule ^api/boards/([a-zA-Z0-9_-]+)/category/([0-9]+)/page/([0-9]+)/?$ modules/api/rest.php?type=list&mid=$1&category=$2&page=$3 [L,QSA] 추가할까요?