OAuth Setup

Supersaas uses nuxt-auth-utils to handle OAuth. The open souce library from Atinux.

Supersaas comes with Google, Github and Discord OAuth providers as examples to get you started.

You can find the code for oauth providers in

1. Google: /server/api/auth/oauth/google.ts
2. Github: /server/api/auth/oauth/github.ts
3. Discord: /server/api/auth/oauth/discord.ts

There's also a oauth.ts file that resolved the provider response and creates a user in the database if it doesn't exist.

OAuth Flow

Setting up the providers

All you need to do is set the respective providers credentials in you .env file.

NUXT_OAUTH_PROVIDER_CLIENT_ID NUXT_OAUTH_PROVIDER_CLIENT_SECRET

or if you need a more explicit way, you can set them in your nuxt.config.ts file

export default defineNuxtConfig({
  runtimeConfig: {
    oauth: {
      <provider>: {
        clientId: process.env.NUXT_OAUTH_<PROVIDER>_CLIENT_ID,
        clientSecret: process.env.NUXT_OAUTH_<PROVIDER>_CLIENT_SECRET,
      }
    }
  }
})

Read more about Nuxt Auth Utils

oAuth setup

Callback URLs for supersaas.dev v3

https://<your-app-url>/api/auth/oauth/google

https://<your-app-url>/api/auth/oauth/github

https://<your-app-url>/api/auth/oauth/discord

I have made a video to show you how how to setup oAuth on Google & Github, since there are a lot of steps to do it. The video was made some time ago and the callback URLs are slightly different, but the steps are the same.