Lộ trình cá nhânBuild Website Động cùng AI & Supabase: Full-Stack Web App, Auth, Database & Thanh toán Tự động
3/8

Giáo trình tự học miễn phí · Dịch vụ hỗ trợ theo nhu cầu.

Bài 0335phút ước tínhThực chiến · Builder

3. Xây Dựng Authentication: Đăng Nhập Email, Google OAuth & Phân Quyền Vai Trò

Tạo hệ thống đăng ký, đăng nhập an toàn với Supabase Auth: Đăng nhập Magic Link, Google OAuth 1-click và bảo vệ các Private Routes.

🔐 3 Cơ Chế Đăng Nhập Hiện Đại

  1. Email & Password: Đăng ký truyền thống với xác thực mật khẩu mã hóa bcrypt.
  2. Magic Link (Passwordless): Đăng nhập bằng đường link bảo mật gửi trực tiếp vào email, người dùng không cần nhớ mật khẩu.
  3. Google / GitHub OAuth: Đăng nhập 1-click tiện lợi thông qua tài khoản Google có sẵn.
example.py
// supabaseAuth.ts
import { createClient } from '@supabase/supabase-js';

export const supabase = createClient(
  import.meta.env.VITE_SUPABASE_URL,
  import.meta.env.VITE_SUPABASE_ANON_KEY
);

// Hàm đăng nhập bằng Google OAuth
export async function signInWithGoogle() {
  const { data, error } = await supabase.auth.signInWithOAuth({
    provider: 'google',
    options: {
      redirectTo: window.location.origin + '/dashboard'
    }
  });
  if (error) throw error;
  return data;
}
Thực hành

Thực hành và tự đánh giá

Kích hoạt Google Provider trong Supabase Dashboard, lấy Client ID từ Google Cloud Console và kiểm tra đăng nhập thành công trên ứng dụng.

⚖️ Bản quyền sở hữu trí tuệ: © 2026 AI Tinh Gọn (aitinhgon.vn) · Giấy phép Creative Commons CC BY-NC-ND 4.0. Cho phép tự học cá nhân, nghiêm cấm thương mại hóa hoặc bán lại. Giáo trình mở →

Tiến độ tự học lưu trên trình duyệt này. Chỉ đánh dấu khi đã kiểm tra sản phẩm thực hành.