• Blog
  • Documentation
  • Courses
  • Changelog
  • AI Starters
  • UI Kit
  • FAQ
  • Supamode
    New
  • Pricing

Launch your next SaaS in record time with Makerkit, a React SaaS Boilerplate for Next.js and Supabase.

Makerkit is a product of Makerkit Pte Ltd (registered in the Republic of Singapore)Company Registration No: 202407149CFor support or inquiries, please contact us

About
  • FAQ
  • Contact
  • Verify your Discord
  • Consultation
  • Open Source
  • Become an Affiliate
Product
  • Documentation
  • Blog
  • Changelog
  • UI Blocks
  • Figma UI Kit
  • AI SaaS Starters
License
  • Activate License
  • Upgrade License
  • Invite Member
Legal
  • Terms of License
  • Global Configuration
    • Environment Variables
    • Feature Flags
  • Server Actions
    • Sending CSRF Token to Actions
    • Server Actions Error Handling
  • The Makerkit SDK
    • User SDK
    • Organization SDK
    • Organization Subscription SDK
    • Data Loader SDK
  • Architecture and Folder Structure
    • Structure your Application
    • Data Model
    • Adding API Routes
    • Change Authentication strategy
    • Fetching the signed in User
    • Reading Records from Postgres
    • Creating a Record
    • Seeding Local Data
    • Introduction
    • Configuring Plans
    • Project Configuration
    • Updating the Navigation menu
    • Adding a new translation string
    • Supabase is not starting
    • Calling API Routes from the client
    • Adding Pages
    • Updating the Sidebar menu
    • Setup oAuth
    • Fetching the selected Organization
    • Resetting the local DB
    • Running the Stripe Webhook locally
    • Branding
    • Setting a Default Language
    • Supabase is not stopping
    • Dark Theme
    • Theming
    • API Routes vs Server Actions
    • Generating Database Types
    • Updating the Logo
    • Adding a new language in the Next.js Supabase SaaS Kit
    • Tables/Functions not found
    • Updating the Fonts
    • Adding Pages
    • Adding a new translation file
    • Contentlayer gets stuck
    • Guarding Pages
    • Using Lemon Squeezy instead of Stripe
    • Updating the Favicons
    • Using the Language Switcher
    • Dynamic server usage error
    • Environment variables
    • Detect current Locale
    • 403 error with API/Actions
    • Setting up Emails
This documentation is for a legacy version of Next.js and Supabase. For the latest version, please visit the Next.js and Supabase V2 documentation

Fetching the signed in User

Learn how to fetch the signed in user from the backend and frontend.

There are several ways to fetch the signed in user, depending on the use-case.

Fetching the signed in user from the backend

To do so, use the function requireSession, which also takes care of redirecting the user to the login page if they are not signed in, and checking the correct MFA access level if the user opted in.

You can use this function in:

  • API Routes
  • Server Actions
  • Server Components

Using "requireSession" in API Routes

When using API routes, you can retrieve the signed in user using the requireSession function.

tsx
import getSupabaseRouteHandlerClient from '~/core/supabase/route-handler-client';
import requireSession from '~/lib/user/require-session';
export async function POST() {
const client = getSupabaseRouteHandlerClient();
const session = await requireSession(client);
}

Using "requireSession" in Server Actions

When using server actions, you can retrieve the signed in user using the requireSession function.

tsx
'use server';
import getSupabaseRouteHandlerClient from '~/core/supabase/route-handler-client';
import requireSession from '~/lib/user/require-session';
export async function yourServerAction() {
const client = getSupabaseRouteHandlerClient();
const session = await requireSession(client);
// use session here
}

Using "requireSession" in Server Components

You can use the requireSession function in Server Components as well.

tsx
async function PageComponent() {
const client = getSupabaseServerComponentClient();
const session = await requireSession(client);
// use session here
}

Fetching the signed in user from the frontend

When in the scope of the app/dashboard/[organization] layout, the app automatically injects the user session in the context layout.

This includes the user ID, email, and other authentication data, as well as the user's Supabase DB record.

Getting the user Session with "useUserSession"

To retrieve the signed in user from the frontend, you can use the useUserSession hook:

tsx
import useUserSession from '~/core/hooks/use-user-session';
const userSession = useUserSession();

This is a React hook and can only be used inside a React component.

Getting the user ID with "useUserId"

To retrieve the signed in user ID from the frontend, you can use the useUserId hook:

tsx
import useUserId from '~/core/hooks/use-user-id';
const userId = useUserId();

This is a React hook and can only be used inside a React component.

Getting the user role within the organization with "useUserRole"

To retrieve the signed in user role of the current organization from the frontend, you can use the useUserRole hook:

tsx
import useCurrentUserRole from '~/core/hooks/use-current-user-role';
const role = useCurrentUserRole();

This is a React hook and can only be used inside a React component.

On this page
  1. Fetching the signed in user from the backend
    1. Using "requireSession" in API Routes
    2. Using "requireSession" in Server Actions
    3. Using "requireSession" in Server Components
  2. Fetching the signed in user from the frontend
    1. Getting the user Session with "useUserSession"
    2. Getting the user ID with "useUserId"
    3. Getting the user role within the organization with "useUserRole"