[TIL #58] 로그아웃 400에러 트러블슈팅

문제

로그아웃만 하면 자꾸 400 에러가 난다.

원래 코드

import { Tables } from '@/types/supabase';
import { createClient } from '@/utils/supabase/server';
import { NextResponse } from 'next/server';

export async function GET() {
  const supabase = createClient();

  const {
    data: { user },
  } = await supabase.auth.getUser();

  if (!user) {
     return NextResponse.json({ error: 'id가 없습니다.' }, { status: 400 });
  }
  const { data, error } = await supabase.from('users').select().eq('id', user.id).single()

  if (error) {
    return NextResponse.json({ error: error.message }, { status: 500 });
  }

  return NextResponse.json(data);
}

getUser route의 문제인걸 단번에 알았는데,
user가 없을때 적어놓은 400에러를 반환하는 것이다.

 return NextResponse.json({ error: 'id가 없습니다.' }, { status: 400 });

이렇게

 if (!user) { return null;}

이런식으로 수정하면 500에러가 계속 나서, console을 계속 찍어보니, console은 계속 나오지도 않는 상황. 그럼 아마 이 코드는 돌지 않는다는 건데, 그러면 로그아웃이 되면 안되는데, 또 로그아웃은 잘 된다.

그냥 로그아웃은 잘 되는데 그냥 400 에러만 뜨는 것.

지옥의 400에러와 500에러

---

해결

함수나 API 라우트에서 user 변수가 유효하지 않을 경우, 더 이상 코드를 실행할 필요가 없으므로, 즉시 종료하고 null 응답을 반환할 수 있게 NextResponse.json(null)로 바꿔주었더니 해결했다.

해결 코드

import { Tables } from '@/types/supabase';
import { createClient } from '@/utils/supabase/server';
import { NextResponse } from 'next/server';

export async function GET() {
  const supabase = createClient();

  const {
    data: { user },
  } = await supabase.auth.getUser();

  if (!user) {
    return NextResponse.json(null);
  }
  const { data, error } = await supabase.from('users').select().eq('id', user.id).single()

  if (error) {
    return NextResponse.json({ error: error.message }, { status: 500 });
  }

  return NextResponse.json(data);
}