Sahil
Note: This project makes use of arctic library.
- Lucia:
- Google Login with - arctic Docs: Click here
❤️ Checkout my latest - svelte-express-google-login on github.
Also: I have made simple video of explanation of this project in my macbook as well. You can check this to quickly grasp this project as well.
Deployed at:
Last tested on 11 Jan 2025
- https://lucia-example-sveltekit-google-oauth.onrender.com/login (works tested)
- https://lucia-example-sveltekit-google-oauth.vercel.app/login (works tested)
Please add following urls to GCC (Google Cloud Console):
- (You can skip adding these because it works without them as well) Authorized JavaScript origins:
- ⭐ (MUST add these) Authorized redirect URIs:
❤️ Redirect url need to be setup in google cloud console and we in local .env file or deployment environment e.g., vercel or render as well. We use redirect url in file - src/lib/server/oauth.ts. You can also check .env.example file to see values to be used in deployment platforms (vercel or render).
Forked from: https://github.com/lucia-auth/example-sveltekit-google-oauth.
Note: For render.com deployment: I am setting preview port as 10000 in vite.config.ts file. (source)
Google OAuth example in SvelteKit
Initialize project
Register an OAuth client on the Google API Console. Paste the client ID and secret to a .env file.
GOOGLE_CLIENT_ID=''
GOOGLE_CLIENT_SECRET=''
GOOGLE_REDIRECT_URI='http://localhost:5173/login/google/callback'
# You must add respective GOOGLE_REDIRECT_URI in the deployment environment (vercel/rener) AND
# to GCC (Google Cloud Console) as well. It takes 5 mins to update in Google Cloud Console.
# vercel.com deployment
# GOOGLE_REDIRECT_URI = "https://lucia-example-sveltekit-google-oauth.vercel.app/login/google/callback"
# render.com deployment
# GOOGLE_REDIRECT_URI = "https://lucia-example-sveltekit-google-oauth.onrender.com/login/google/callback"
Run the application:
pnpm i
pnpm dev
