회사에서 NextJS로 개발하고 Vercel로 배포한 홈페이지의 도메인 변경 요청이 들어왔다. (참고로 도메인은 타사이트에서 구매해두었던 도메인을 vercel에 등록하여 사용하고 있었음)
처음에는 그냥 vercel 에서 redirect만 해주고 끝났다고 생각했는데,
생각해보니 SEO를 위해 등록해둔 서치콘솔에서도 기존 도메인을 신규 도메인으로 연결해주는 작업이 남아있었다.
서치콘솔에서 방법을 찾아보니, 아래와같이 장황하고 긴 글이 있어서 너무 어렵게 느껴졌으므로,
실제로 내가 해준 것들 위주로만 간단하게 정리하고자 한다.

사이트 이동 및 이전 | Google 검색 센터 | 문서 | Google for Developers

1. Vercel 에서 새 도메인으로 redirect

1-1. 도메인 추가

Project Settings ⇒ Domains에서 추가할 도메인을 입력하고 Add 버튼을 클릭한다.

이 때, 필요에 따라 DNS 설정을 해준다.

1-2 도메인 리디렉션

리디렉션할 도메인에서 Edit 버튼을 클릭한다.

Redirect to 드롭다운에서 리디렉션할 도메인을 선택하고 저장한다.

✱등록완료된 도메인만 리스트업됨

- 이 때, 서치콘솔에서 주소변경을 진행하려면 Status를 301 로 설정해주어야 한다.

2. 서치콘솔에서 도메인 이전

2-1. 신규 도메인 등록

신규 도메인을 등록한다. 자세한 방법은 도메인을 이전하려는 사람은 알고 있으리라 생각되기에 생략하도록 하겠다.

권한 인증이 필요하다면, Vercel의 DNS Records 에서 등록해주면 된다.

2-2. 권한 인증

Project Settings ⇒ Domains 에서 인증할 도메인 하단의 View DNS Records & More for 클릭

2. value에 서치콘솔에서 요구하는 값 등록

2-3. 사이트맵 항목에서 새로운 URL을 가리키도록 주석 업데이트

새로운 URL마다 자체 참조 rel="canonical" <link> 태그가 있어야 합니다. 이동한 사이트에 rel-alternate-hreflang 주석을 사용하여 주석기 달린 다국어 또는 다국적 페이지가 있다면 새 URL을 사용하도록 주석을 업데이트해야 합니다.

1. nextJS 에서는 루트 layout.tsx 파일에서 메타태그에 추가해주면 된다.

export const metadata = {
  title: title,
  description: description,
  ...
  alternates: { 👈🏻 여기
    canonical: '새로운 도메인', 👈🏻 이것
    languages: {
      'ko': '/ko',
      'en': '/en',
    },
  },
}

2. 렌더링된 돔을 확인해보면, 적용이 잘 된걸 볼 수 있다.