Authentication

Selfkit use Lucia for the authentication, it's a learning resource on implementing auth from scratch (previously a library).

Why Lucia ?

Creating your own authentication system ensures full control, customization, and no reliance on third-party updates or vulnerabilities, offering a tailored, lightweight, and maintainable solution.

Selfkit provide many features by default (details below) directly in code, so you are free to add, modify or remove them as you want.

Features

• Email/password login
• Email confirmation
• Authentication with Providers (i.e. Google)
• Forgot password
• 2FA (Two-factor authentication)
• Passkey
• Secret key
• Recovery code (for 2FA / passkey / secret key)
• Modifiy email/password (not possible for account created via providers)
• Rate limiting

Setup Google Oauth

1. Create a new project on Google Cloud .
2. Search for Google Auth Platform in the top search bar and select the first result.
3. Navigate to the Branding tab, complete the required fields.
4. On the App domain add :
   • https://your-domain
   • https://your-domain/privacy
   • https://your-domain/terms-of-services
5. Click Save.
6. Open the Data Access tab and add the following scopes:
   • .../auth/userinfo.email
   • .../auth/userinfo.profile
   • .../openid
7. Click Save.
8. Go to the Clients tab and click on Create client button.
9. Fill inputs and add these URIs on Authorized Javascript origins

• https://your-app-domain
• http://localhost:5173 // Not required but useful to test your app in local

11. On Authorized redirect URIs add:

• https://your-app-domain/auth/google/callback
• http://localhost:5173/auth/google/callback

12. Click on Save and copy Client ID and Client secret to your environment variables file (GOOGLE_CLIENT_ID and GOOGLE_CLIENT_SECRET)
13. Also, fill the GOOGLE_REDIRECTION_URI according to your environment:

• https://your-app-domain/auth/google/callback // For production
• http://localhost:5173/auth/google/callbackk // For development

14. Go to the Audience tab and add test users.
15. Once your app is ready for production, click the Publish App button.

Handle private routes

Check authorization (User log in)

You can specify which routes require authorization by using the checkAuthorization function within the load function. Routes without this check will remain publicly accessible to both anonymous and authenticated users.

import { checkAuthorization } from '$lib/server/auth/serverUtils';

export async function load({ locals }) {
	checkAuthorization(locals);
	return {};
}

The checkAuthorization function handle redirection like this :

This function also provide a second parameter to enable/disable some verification.

type Config = {
        checkEmailVerified?: boolean; // Default : true
        checkRegistered2FA?: boolean;  // Default : false
        checkTwoFactor?: boolean; // Default : false
}

Check API authorization

TODO

Check subscription

You can also specify which routes are available for subscribed users (i.e. user with an active subscription), by using the checkSubscription function. You can use it in the same way as the checkAuthorization function:

import { checkSubscription } from '$lib/server/auth/serverUtils';

export async function load({ locals }) {
	checkSubscription(locals.subscriptions);
	return {};
}

Profile page

Once a user is logged in, they have access to their Profile page, where they can:

• View their profile (empty by default).
• View their subscription details (empty if no subscription exists).
• Configure their profile:
  • Change email/password (not available for accounts created via a provider).
  • Set up TOTP, passkeys, and security keys.

Links

• Google cloud console
• Lucia website