자회사 홈페이지를 모노레포 프로젝트로 리팩토링 한 이후 구글 검색엔진에서 PC 환경인데 모바일 페이지 URL을 노출하는 현상이 발생했다.

리팩토링 당시 SEO까지 고려해서 SSR로 마이그레이션을 했어야했지만 이미 엎질러진 물…CSR에서 SEO를 최적화를 시도해보기로 했다.

먼저, 주 타게팅 사이트인 네이버, 구글의 크롤링 방식을 알아보았다.

• 네이버

// <https://searchadvisor.naver.com/guide/seo-advanced-javascript>

SPA 사이트의 경우 자바스크립트가 웹 페이지의 구조 결정에 주도적인 역할을 하기 때문에 네이버 검색로봇도 수집 및 콘텐츠 해석 과정에서 자바스크립트의 영향도를 측정하고 해석합니다. 

// SSR 권장
이러한 일련의 과정은 전통적인 HTML 페이지의 해석보다 몇 배 이상의 리소스가 필요한 작업입니다. 그러므로 SPA 사이트라도 HTML의 주요 영역 생성은 검색로봇이 잘 인식할 수 있도록 서버에서 렌더링 (Server Side Rendering)을 처리하는 것을 권장합니다.

• 구글

// <https://developers.google.com/search/docs/crawling-indexing/javascript/javascript-seo-basics?hl=ko>

URL 크롤링 및 HTML 응답 파싱은 HTTP 응답의 HTML에 모든 콘텐츠가 포함되어 있는 기존 방식의 웹사이트 또는 서버 측 렌더링 페이지에서 원활하게 작동합니다. 일부 JavaScript 사이트에서는 초기 HTML에 실제 콘텐츠가 포함되어 있지 않으며 Google이 JavaScript에서 생성되는 실제 페이지 콘텐츠를 보기 위해 JavaScript를 실행해야 하는 앱 셸 모드를 사용하기도 합니다.

두 사이트 모두 CSR 프로젝트도 크롤링 할 수 있다!!

이제 크롤링을 최적화하기 위한 방안을 정하고 실행만 하면 된다.

해결해야 할 문제점

1) 원하는 URL 노출

검색 된 사이트 결과를 확인하면 모바일 URL로 심지어 쿼리 파라미터가 포함 된 페이지가 노출 되는걸 확인할 수 있다.

또한, http로 노출 되는 홈페이지도 확인할 수 있다.

물론, 사용자가 접근 시 https로 Redirect 해주고 있지만 노출 결과가 http로 나오길 원하지는 않는다.