Hướng Dẫn Cơ Bản Xác Thực Với Better-Auth

Chào các lập trình viên! 👋 Trong bài viết này, tôi sẽ hướng dẫn bạn cách thiết lập xác thực trong dự án Node.js/Next.js sử dụng Better-Auth — một thư viện xác thực mạnh mẽ và dễ sử dụng. Bài viết này dựa trên tập đầu tiên trong danh sách phát YouTube Cơ Bản Về Better-Auth.

Better-Auth giúp việc cài đặt xác thực an toàn trở nên đơn giản hơn với các tính năng như:

• ✅ Xác thực Email + Mật khẩu
• ✅ Đăng nhập qua mạng xã hội
• ✅ Giới hạn tỷ lệ truy cập tích hợp sẵn
• ✅ Quản lý cơ sở dữ liệu và bộ chuyển đổi tự động
• ✅ Hỗ trợ xác thực hai yếu tố
• ✅ API khách hàng đơn giản cho tích hợp frontend

Nghe có vẻ thú vị phải không? Hãy cùng khám phá! 🚀

🛠 Thiết lập dự án

Trong hướng dẫn này, tôi sẽ làm việc trên dự án cá nhân của mình — một ứng dụng chia sẻ chuyến đi. Chúng ta sẽ tích hợp Better-Auth từng bước.

1. Cài đặt các phụ thuộc

Chúng ta cần Better-Auth, Drizzle ORM và Postgres.

bun add better-auth drizzle-orm postgres

2. Biến môi trường

Tạo một khóa bí mật và thêm vào tệp .env của bạn:

BETTER_AUTH_SECRET=your-secret-key
BETTER_AUTH_URL=http://localhost:3000 # Địa chỉ URL cơ sở của ứng dụng
DATABASE_URL=postgresql://user:password@localhost:5432/dbname

⚙️ Thiết lập cơ sở dữ liệu với Drizzle

Better-Auth đi kèm với các lược đồ sẵn sàng sử dụng. Chúng ta sẽ sao chép chúng vào dự án của mình và thực hiện các di chuyển.

1. Tạo lược đồ

bunx @better-auth/cli generate # tạo lược đồ better-auth

2. Chạy di chuyển

bunx drizzle-kit generate # tạo tệp di chuyển
bunx drizzle-kit migrate

Sau khi hoàn tất, cơ sở dữ liệu của bạn sẽ có tất cả các bảng cần thiết.

🔑 Kích hoạt xác thực Email/Mật khẩu

Trong thiết lập máy chủ Better-Auth, kích hoạt xác thực email/mật khẩu:

// lib/auth.ts
import { betterAuth } from "better-auth";
import { drizzleAdapter } from "better-auth/adapters/drizzle";
import { db } from "@/db"; // phiên bản drizzle của bạn
import * as schema from "@/db/schema"; // lược đồ drizzle của bạn

export const auth = betterAuth({
  database: drizzleAdapter(db, {
    provider: "pg", // hoặc "mysql", "sqlite"
    schema,
  }),
  emailAndPassword: {
    enabled: true,
  },
});

🖥 Thiết lập phía khách hàng

Better-Auth cung cấp một tiện ích khách hàng để tích hợp frontend một cách đơn giản.

// lib/auth-client.ts
import { createAuthClient } from "better-auth/react";

export const authClient = createAuthClient({
  /** Địa chỉ URL cơ sở của máy chủ (không bắt buộc nếu bạn đang sử dụng cùng miền) */
  baseURL: "http://localhost:3000",
});

📡 Các tuyến API Next.js

Bây giờ, hãy kết nối nó với các tuyến của Next.js.

// app/api/auth/[...all]/route.ts
import { auth } from "@/lib/auth";
import { toNextJsHandler } from "better-auth/next-js";

export const { GET, POST } = toNextJsHandler(auth.handler);

Tuyến này sẽ xử lý tất cả các API đăng nhập, đăng ký và quản lý phiên.

👤 Thực hiện Đăng ký

Trên trang đăng ký của bạn, hãy sử dụng khách hàng:

async function handleRegister(e) {
  e.preventDefault();
  try {
    await authClient.signUp.email({
      name: form.name,
      email: form.email,
      password: form.password,
      callbackUrl: "/",
    });
  } catch (err) {
    console.error(err);
  }
}

🔐 Thực hiện Đăng nhập

Tương tự, trên trang đăng nhập của bạn:

async function handleLogin(e) {
  e.preventDefault();
  try {
    await authClient.signIn.email({
      email: form.email,
      password: form.password,
      callbackUrl: "/",
    });
  } catch (err) {
    console.error(err);
  }
}

🎉 Kiểm tra nó

• Đã thử đăng ký → Người dùng đã được tạo thành công ✅
• Đã thử đăng nhập → Được chuyển hướng đến trang chính với phản hồi 200 ✅

Thế là xong! Chúng ta đã có một luồng xác thực hoạt động với Better-Auth.

📌 Điều gì tiếp theo?

Hướng dẫn này chỉ bao gồm những điều cơ bản:

• Thiết lập Better-Auth
• Chạy các di chuyển cơ sở dữ liệu với Drizzle
• Thực hiện Đăng nhập & Đăng ký

Trong các bài viết/video tiếp theo, tôi sẽ đề cập đến:

• 🔑 Xác thực & Quyền truy cập dựa trên vai trò
• ⚡ Giới hạn tỷ lệ
• 🔒 Xác thực hai yếu tố
• 🔗 Đăng nhập qua mạng xã hội

Hãy theo dõi nhé!

🔗 Kết nối với tôi

• 🐦 Facebook
• 💻 GitHub
• 💼 LinkedIn
• 📽️ Youtube

👉 Nếu bạn thấy bài viết này hữu ích, hãy để lại một bình luận và cho tôi biết bạn đang xây dựng gì với Better-Auth. Và đừng quên theo dõi tôi trên DEV.to + đăng ký trên YouTube để nhận thêm nhiều hướng dẫn hơn.

Chúc bạn lập trình vui vẻ! ✨