[Team Project] 뉴스피드 프로젝트 (3)

Supabase Auth 와 커스텀 테이블 연동

insert 함수 사용한 일반적인 회원가입 패턴
-> 이는 회원가입 후 별도로 users 테이블에 데이터 추가명령 해줘야 하는 번거롭다는 단점이 있다.

export const signUp = async (formData) => {
	const {email, password, displayName, age, first_name} = formData;
  const { data, error } = await supabase.auth.signUp({
    email: "rjc1704@gmail.com",
    password: "example-password",
  });
  if (error) {
	  console.log(error);
		// 에러 처리
		return;
  }
  
  const { data: signUpData, error: signUpError } = await supabase
	  .from("users")
	  .insert({ email, displayName, age, first_name });
	
	if (signUpError) {
		console.log(signUpError);
		// 에러 처리
		return;
	}
	return signUpData;
};

필요성

Supabase는 PostgreSQL을 기반으로 한 백엔드 서비스로, 데이터베이스, 인증, 스토리지 등 다양한 기능을 제공한다. Supabase에서 제공하는 Function 기능을 이용하면 데이터베이스 내에서 트리거를 설정하여 특정 이벤트가 발생할 때 자동적으로 함수를 실행할 수 있다.

Supabase의 Auth와 트리거 기능을 결합하여 사용자가 회원가입할 때 원하는 퍼블릭 스키마 테이블에 자동적으로 기본 프로필을 자동적으로 생성하게 만들 수 있다.

posts 테이블 생성

create table
  public.posts (
    id uuid not null,
    username text null,
    avatar_url text null,
    email text null,
    constraint profiles_pkey primary key (id),
    constraint profiles_id_fkey foreign key (id) references auth.users (id) on delete cascade
  ) tablespace pg_default;

중요한 점은 id와 supabase auth의 id와 외래키로 묶어줘야 한다는 것!

Trigger Function 생성

-- inserts a row into public.posts
create function public.handle_new_user()
returns trigger
language plpgsql
security definer set search_path = posts
as $$
begin
  -- new에는 Auth에 Insert된 Row가 들어있다.
  
  -- oAuth (구글, Giuthb 등)로그인 할 경우 닉네임이 full_name 혹은 username으로 들어온다.
  IF new.raw_user_meta_data ->> 'full_name' is not null then
  insert into public.posts (id, username, email, avatar_url)
  values (new.id, new.raw_user_meta_data ->> 'full_name',
   new.email, new.raw_user_meta_data ->> 'avatar_url');
  return new;
  end IF;

 -- 따라서 여러 경우로 분기처리를 해준다.
  IF new.raw_user_meta_data ->> 'username' is not null then
  insert into public.posts (id, username, email, avatar_url)
  values (new.id, new.raw_user_meta_data ->> 'username',
   new.email, new.raw_user_meta_data ->> 'avatar_url');
  return new;
  end IF;
end;
$$;

-- trigger the function every time a user is created
create trigger on_auth_user_created
  after insert on auth.users
  for each row execute procedure public.handle_new_user();

---

참고자료

• https://velog.io/@sanghyeon/supabase-Auth%EC%99%80-%EC%BB%A4%EC%8A%A4%ED%85%80-%ED%85%8C%EC%9D%B4%EB%B8%94-%EC%97%B0%EB%8F%99