웹 개발
SSG 페이지가 검색 결과에 안 나타날 때
정적 페이지는 빌드 시점에 이미 생성된다. 검색 노출이 안 되려면 메타데이터, robots.txt, 사이트맵을 먼저 확인해야 한다.
Next.js나 다른 정적 생성(SSG) 프레임워크를 쓸 때, 빌드는 완벽한데 검색 엔진에 노출이 안 되는 경우가 있다.
보통은 동적 라우트, 메타데이터 누락, 또는 배포 직후 크롤링 지연 때문이다.
먼저 빌드된 HTML을 직접 본다
# Next.js의 경우
npm run build
cat .next/server/pages/about.html | head -30
# 또는 배포된 사이트에서
curl -s https://example.com/about | grep -i 'meta name="description"'
HTML의 <head> 섹션을 본다. <title>, <meta description>, <meta og:*> 태그가 제대로 있는지 확인하자. 빌드 과정에서 메타데이터가 누락되거나 동적으로 주입되지 않았을 수 있다.
두 번째: robots.txt와 sitemap을 확인한다
# 배포된 사이트의 robots.txt
curl -s https://example.com/robots.txt
# User-agent: *
# Allow: /
# Sitemap: https://example.com/sitemap.xml
# sitemap.xml도 본다
curl -s https://example.com/sitemap.xml | head -20
robots.txt가 크롤링을 막고 있진 않은지 확인하고, sitemap.xml이 실제로 존재하고 해당 URL들을 포함하고 있는지 본다.
세 번째: 동적 라우트가 제대로 생성되었는지 확인한다
// Next.js getStaticPaths 예제
export async function getStaticPaths() {
const posts = await fetchAllPosts();
return {
paths: posts.map(post => ({
params: { id: post.id }
})),
fallback: 'blocking' // 또는 false
};
}
동적 라우트는 getStaticPaths에서 반환한 경로들만 빌드 시점에 생성된다. 빌드 후 .next 디렉토리나 배포된 정적 파일 디렉토리에서 해당 페이지가 존재하는지 확인하자.
네 번째: 배포 후 Google Search Console에서 요청한다
# 또는 커맨드라인에서
curl -I https://example.com/about
# 상태 코드가 200이면 배포는 제대로 된 것
정적 파일이 잘 배포되었다면, Google Search Console에서 "요청" 버튼을 클릭해 수동으로 크롤링을 요청할 수 있다. 새로 배포한 페이지는 검색 결과에 나타나는 데 며칠이 걸릴 수 있다.
다섯 번째: 빌드 시점의 데이터 소스를 확인한다
// 문제: 빌드 중 API가 실패해도 무시됨
export async function getStaticProps({ params }) {
try {
const data = await fetchData(params.id);
return { props: { data } };
} catch (error) {
// 에러를 무시하고 fallback을 렌더링
return { notFound: true };
}
}
빌드 중 API나 데이터베이스에서 데이터를 못 가져오면, 페이지가 생성되지 않거나 incomplete 상태로 남을 수 있다. 빌드 로그에서 데이터 로딩 실패 메시지를 확인하자.
체크리스트
- 실제 배포된 HTML의
<title>과<meta description>을 본다 robots.txt가 크롤링을 막고 있진 않은지 확인한다sitemap.xml이 존재하고 최신 URL들을 포함하는지 본다- 동적 라우트는
getStaticPaths에서 경로를 반환하는지 확인한다 - 빌드 로그에서 데이터 로딩 에러를 본다
- Google Search Console에서 수동 요청을 한다
SSG 페이지는 한 번 생성되면 변하지 않으므로, 빌드 시점의 데이터와 메타데이터가 정확한지 확인하는 게 가장 중요하다.