Nitro 통합

Better Auth는 Nitro 애플리케이션(웹 서버를 구축하기 위한 오픈 소스 프레임워크)과 통합할 수 있습니다.

이 가이드는 몇 가지 간단한 단계로 Nitro 애플리케이션과 Better Auth를 통합하는 데 도움을 줍니다.

새 Nitro 애플리케이션 생성

다음 명령어를 사용하여 새 Nitro 애플리케이션을 스캐폴딩하여 시작하세요:

Terminal
npx giget@latest nitro nitro-app --install

이렇게 하면 nitro-app 디렉터리가 생성되고 모든 종속성이 설치됩니다. 이제 코드 에디터에서 nitro-app 디렉터리를 열 수 있습니다.

Prisma Adapter 설정

이 가이드는 Prisma에 대한 기본적인 이해가 있다고 가정합니다. Prisma를 처음 사용하는 경우 Prisma 문서를 확인하세요.

이 가이드에서 사용되는 sqlite 데이터베이스는 프로덕션 환경에서 작동하지 않습니다. PostgreSQL과 같은 프로덕션 준비 데이터베이스로 교체해야 합니다.

이 가이드에서는 Prisma adapter를 사용할 것입니다. 다음 명령어를 실행하여 prisma client를 설치할 수 있습니다:

npm install @prisma/client

prisma는 다음 명령어를 사용하여 개발 종속성으로 설치할 수 있습니다:

npm install -D prisma

다음 명령어를 실행하여 prisma 디렉터리에 schema.prisma 파일을 생성하세요:

Terminal
npx prisma init

이제 schema.prisma 파일의 내용을 다음과 같이 교체할 수 있습니다:

prisma/schema.prisma
generator client {
  provider = "prisma-client-js"
}

datasource db {
  provider = "sqlite"
  url      = env("DATABASE_URL")
}

// 삭제될 예정입니다. Prisma client를 생성하기 위해서만 필요합니다
model Test {
  id   Int    @id @default(autoincrement())
  name String
}

.env 파일의 DATABASE_URL을 데이터베이스 위치를 가리키도록 업데이트하세요.

.env
DATABASE_URL="file:./dev.db"

다음 명령어를 실행하여 Prisma client를 생성하고 데이터베이스를 동기화하세요:

Terminal
npx prisma db push

Better Auth 설치 및 구성

설치 가이드의 1단계와 2단계를 따라 Nitro 애플리케이션에 Better Auth를 설치하고 환경 변수를 설정하세요.

완료되면 server/utils/auth.ts 파일 내에 Better Auth 인스턴스를 생성하세요.

server/utils/auth.ts
import { betterAuth } from "better-auth";
import { prismaAdapter } from "better-auth/adapters/prisma";
import { PrismaClient } from "@prisma/client";

const prisma = new PrismaClient();
export const auth = betterAuth({
  database: prismaAdapter(prisma, { provider: "sqlite" }),
  emailAndPassword: { enabled: true },
});

Prisma 스키마 업데이트

다음 명령어를 실행하여 Better Auth CLI를 사용하여 Prisma 스키마를 필요한 모델로 업데이트하세요:

Terminal
npx @better-auth/cli generate --config server/utils/auth.ts

--config 플래그는 Better Auth 인스턴스를 생성한 파일의 경로를 지정하는 데 사용됩니다.

prisma/schema.prisma 파일로 이동하여 파일을 저장하면 자동 포맷이 트리거됩니다.

파일을 저장한 후 npx prisma db push 명령어를 실행하여 데이터베이스 스키마를 업데이트할 수 있습니다.

핸들러 마운트

이제 Nitro 애플리케이션에 Better Auth 핸들러를 마운트할 수 있습니다. server/routes/api/auth/[...all].ts 파일에 다음 코드를 추가하면 됩니다:

server/routes/api/auth/[...all].ts
export default defineEventHandler((event) => {
  return auth.handler(toWebRequest(event));
});

이것은 /api/auth/*에 대한 모든 요청을 처리하는 catch-all 라우트입니다.

CORS

플러그인을 생성하여 Nitro 앱에 대한 CORS를 구성할 수 있습니다.

먼저 cors 패키지를 설치하세요:

npm install cors

이제 새 파일 server/plugins/cors.ts를 생성하고 다음 코드를 추가하세요:

server/plugins/cors.ts
import cors from "cors";
export default defineNitroPlugin((plugin) => {
  plugin.h3App.use(
    fromNodeMiddleware(
      cors({
        origin: "*",
      }),
    ),
  );
});

이렇게 하면 모든 라우트에 대해 CORS가 활성화됩니다. origin 속성을 사용자 정의하여 특정 도메인의 요청만 허용할 수 있습니다. 프론트엔드 애플리케이션과 동기화되도록 설정을 확인하세요.

Auth Guard/Middleware

Nitro 애플리케이션에 인증 가드를 추가하여 인증이 필요한 라우트를 보호할 수 있습니다. 새 파일 server/utils/require-auth.ts를 생성하고 다음 코드를 추가하면 됩니다:

server/utils/require-auth.ts
import { EventHandler, H3Event } from "h3";
import { fromNodeHeaders } from "better-auth/node";

/**
 * 라우트에 인증을 요구하는 데 사용되는 미들웨어입니다.
 *
 * 특정 역할이나 권한을 확인하도록 확장할 수 있습니다.
 */
export const requireAuth: EventHandler = async (event: H3Event) => {
  const headers = event.headers;

  const session = await auth.api.getSession({
    headers: headers,
  });
  if (!session)
    throw createError({
      statusCode: 401,
      statusMessage: "Unauthorized",
    });
  // 나중에 사용하기 위해 이벤트 컨텍스트에 세션을 저장할 수 있습니다
  event.context.auth = session;
};

이제 이 이벤트 핸들러/미들웨어를 라우트에서 사용하여 보호할 수 있습니다:

server/routes/api/secret.get.ts
// 라우트 핸들러의 객체 구문
export default defineEventHandler({
  // 이 라우트에 액세스하려면 사용자가 로그인해야 합니다
  onRequest: [requireAuth],
  handler: async (event) => {
    setResponseStatus(event, 201, "Secret data");
    return { message: "Secret data" };
  },
});

예제

Better Auth 및 Prisma와 통합된 Nitro 애플리케이션의 예제는 여기에서 확인할 수 있습니다.

Edit on GitHub

Previous Page

Elysia

Next Page

NestJS

On this page