인프런 커뮤니티 질문&답변

안녕하세요 선생님

1. 새소식 올려주신거 참고해서 await signIn('credentials', { ...data, redirect: true });수정한후 로그인 후 홈으로 이동안됩니다.

home 갔다가 로그인화면으로 이동해버리는데 어디서 이동시키는건지 뒤저봐도 못 찾겠더라구요. 로그인화면으로 새로고침되는듯 합니다...

true만 하고 이전 코드와 다 똑같은데 조언 부탁드립니다 ㅠ

/src/app/(beforeLogin)/_component/Loginmodal.tsx

const onSubmit: SubmitHandler<formProps> = async (data: formProps) => {
		console.log(data);
		try {
			await signIn('credentials', { ...data, redirect: true });
			router.replace('/home');
			console.log('---------------------------------------after LoginModal login')
		} catch(error) {
			console.error(error);
			console.log('아이디와 비밀번호가 일치히자 않습니다.');
		}
	};

src/middleware.ts

export async function middleware() {
  const session = await auth();
  console.log(session, '------------------------------middleware session')
  if (!session) {
    return NextResponse.redirect('http://localhost:3001/i/flow/login');
  }
}

// See 'Matching Paths' below to lean more
// 미들웨어를 적용할 라우트로 로그인을 해야하는 페이지
// 페이지 접근관리 하기 쉬워짐
export const config = {
  matcher: ['/compose/tweet', '/home', '/explore', '/messages', '/search']
}

/src/auth.ts

import NextAuth, {CredentialsSignin} from "next-auth"
// import CredentialsProvider from "next-auth/providers/credentials"
import Credentials from "next-auth/providers/credentials"
import { NextResponse } from 'next/server';

export const {
  // api 라우트
  handlers: { GET, POST },
  // auth 함수 실행하면 로그인 유무알 수 있다.
  auth,
  // 로그인 하는 함수
  signIn
} = NextAuth({
  pages: {
    signIn: "/i/flow/login",
    newUser: '/i/flow/signup',
  },
  providers: [
    Credentials({
      // You can specify which fields should be submitted, by adding keys to the `credentials` object.
      // e.g. domain, username, password, 2FA token, etc.
      credentials: {
        id: {},
        password: {},
      },
      authorize: async (credentials) => {
        console.log('-------------------------------------------auth.ts');
        const authResponse = await fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/login`, {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json'
          },
          body: JSON.stringify(credentials)
        })

        // 여기 주목!!! 서버에서 에러가 발생할 때 그 에러 내용이 서버에 담겨 있을 겁니다.
        console.log(authResponse.ok, authResponse.status, authResponse.statusText)
        if (!authResponse.ok) {
          const credentialsSignin = new CredentialsSignin();
          if (authResponse.status === 404) {
            credentialsSignin.code = 'no_user';
          } else if (authResponse.status === 401) {
            credentialsSignin.code = 'wrong_password';
          }
          throw credentialsSignin;
        }
      
        // 로그인 성공
        const user = await authResponse.json();
        console.log('user', user);
 
        // return user object with the their profile data
        return {
          ...user,
          name: user.nickname,
          email: user.id,
        }
      },
    }),
  ]
})

2. next-auth 소식이나 말쓰하시는거 들어봐도 아직 안정화가 되지 않은것같은데 선생님은 next-auth를 실무에 도입해도 된다고보시나요? 아니면 nodebird 처럼 express로 하는걸 더 추천하실지 궁금합니다. 넥스트오쓰에서 가입한 사용자를 데이터베이스로 볼수있는지도 궁금하구 어차피 배워야할것이니 이런저런 부족한게 좀 있더라도 밀고나가야하는지.. 여유되실때 확인해주시면 감사하겠습니다.