Authentication & Protected Pages

Astroship uses Supabase ↗ for authentication and storage of user information.

Set up Supabase

If you haven’t already, you can set up Supabase by following Auth & DB (Supabase).

Core concepts

1. Authentication

Authentication is performed via the auth middleware (see src/middleware/auth.ts) and made available to your pages via Astro.locals.auth.

You can check that a user is authenticated via:

const isAuthenticated = Astro.locals.auth.isAuthenticated

2. Protected pages

Pages placed under the src/pages/app directory automatically require authentication. You can protect additional paths by ameding authenticatedPaths in src/config.ts

3. User information

User information is stored in the users table (see src/db/prisma/schema.prisma) in your Supabase database and linked with Supabase Auth using the authId field. As you add tables to your database, you can link them to the users table using the id field.

You can access the user information in your pages via:

const user = await Astro.locals.auth.fetchUser();

Diving deeper

1. Adding OAuth providers (Google, GitHub, etc.)

All of the OAuth providers are configured out of the box with callbacks and sign in flows.

To enable a provider:

1. In your Supabase project, go to Authentcation → Providers and enable the desired provider.
2. Add the provider to oAuthProviders in src/config.ts

export const oAuthProviders: Provider[] = [
    "google",
    "github",
];