회원가입 시 자동으로 세션 생성 문제 (Next.js & Supabase)

 

 

Supabase.Auth 회원가입 시 자동으로 세션 생성 문제

 

 

문제 발생

Next.js와 Supabase를 사용하여 회원가입 및 로그인/로그아웃 페이지를 구현하던 중, 회원가입 후 자동으로 로그인되는 문제를 겪었다.

이로 인해 회원가입 후 로그인 페이지로 이동해도 이미 로그인된 상태로 세션이 유지되었고, 결과적으로 예상치 못한 중복 로그인 문제가 발생했다.

 

내용을 찾아보니 `Supabase.auth.signUp`을 사용하면 자동으로 `session`에 저장이 되는 것...

 

 

 

해결

해결 방법 1

회원가입 후 로그아웃 처리 처음에는 아래와 같은 방식으로 문제를 해결했다.

회원가입 성공 후, `signOut` 메서드를 호출하여 자동 생성된 세션을 초기화하고, 로그인 페이지로 이동하도록 처리를 했다.

 

const { error } = await supabase.auth.signUp({
  email,
  password,
  options: {
    data: {
      nickname,
    },
  },
});

if (error) {
  toast.error("회원가입 실패: " + error.message);
} else {
  toast.success("회원가입 성공!");
  await supabase.auth.signOut();  // 로그아웃
  router.push("/login");
}

 

이 방법을 사용하여 일단 문제를 해결할 수 있었다.

그리고 트러블 슈팅을 적고 있다보니 더 나은 방법을 알게 되었다.

 

 

 

해결 방법 2

`autoSignIn` 옵션 사용 Supabase의 `signUp` 메서드에서 `autoSignIn` 옵션을 `false`로 설정하면, 회원가입 시 자동으로 세션이 생성되지 않도록 할 수 있다고 한다.

이 방법을 적용하면 별도로 `signOut`을 호출할 필요 없이 회원가입만 진행하고 로그인 페이지로 이동할 수 있었다.

 

const { error } = await supabase.auth.signUp({
  email,
  password,
  options: {
    data: {
      nickname,
    },
    autoSignIn: false, // 자동 로그인 방지
  },
});

if (error) {
  toast.error("회원가입 실패: " + error.message);
} else {
  toast.success("회원가입 성공!");
  router.push("/login");
}

 

이렇게 하면 자동으로 로그인 세션이 생성되지 않아 더 깔끔한 해결책이 될 수 있다.

 

 

간단하게 정리하자면

첫 번째 방법은 회원가입 후 로그아웃을 호출하는 방식,

두 번째 방법은 autoSignIn 옵션을 사용하여 세션 자동 생성을 방지하는 것이다.

 

나중에 사용할 때는 두번째 방법을 사용해 보는 것으로!!