0
0
Supabasecloud~5 mins

Magic link authentication in Supabase

Choose your learning style9 modes available
LearnWhyDeepVisualTryChallengeProjectRecallTime
Introduction

Magic link authentication lets users sign in by clicking a link sent to their email. It is simple and secure without needing a password.

When you want to make login easy for users without remembering passwords.
When building apps that require quick and secure user access.
When you want to reduce password-related support issues.
When you want to improve user experience with passwordless sign-in.
When you want to increase security by avoiding password theft.
Syntax
Supabase
const { data, error } = await supabase.auth.signInWithOtp({ email: 'user@example.com' })

This code sends a magic link to the user's email.

You only need to provide the user's email address.

Examples
Sends a magic link to Alice's email for login.
Supabase
const { data, error } = await supabase.auth.signInWithOtp({ email: 'alice@example.com' })
Sends a magic link to Bob's email that redirects to a welcome page after login.
Supabase
const { data, error } = await supabase.auth.signInWithOtp({ email: 'bob@example.com', options: { emailRedirectTo: 'https://yourapp.com/welcome' } })
Sample Program

This program creates a Supabase client and sends a magic link to the specified email. It logs success or error messages.

Supabase
import { createClient } from '@supabase/supabase-js'

const supabaseUrl = 'https://xyzcompany.supabase.co'
const supabaseKey = 'public-anonymous-key'
const supabase = createClient(supabaseUrl, supabaseKey)

async function sendMagicLink(email) {
  const { data, error } = await supabase.auth.signInWithOtp({ email })
  if (error) {
    console.error('Error sending magic link:', error.message)
  } else {
    console.log('Magic link sent to:', email)
  }
}

sendMagicLink('user@example.com')
OutputSuccess
Important Notes

Make sure your Supabase project has email authentication enabled.

Users must check their email and click the link to complete login.

You can customize the redirect URL after login using the emailRedirectTo option.

Summary

Magic link authentication lets users log in without passwords by clicking a link sent to their email.

It improves user experience and security by avoiding passwords.

Supabase provides a simple method signInWithOtp to send magic links.