Magic Email Links and CDN

I figured I'd give supabase a try locally. I have the following code:

<script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js"></script>

email
<input type="text" id="email">
<button onclick="signInWithEmail()">signin</button>

<script>
const SUPABASE_KEY = 'xxx'
const SUPABASE_URL = "yyy"
const client = supabase.createClient(SUPABASE_URL, SUPABASE_KEY);

async function signInWithEmail() {
  console.log(`Trying to log in ${document.getElementById("email").value}`)
  const { user, error } = await client.auth.signIn({
    email: document.getElementById("email").value
  })
  console.log(user);
  console.log(error);
}
</script>

<script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js"></script>

email
<input type="text" id="email">
<button onclick="signInWithEmail()">signin</button>

<script>
const SUPABASE_KEY = 'xxx'
const SUPABASE_URL = "yyy"
const client = supabase.createClient(SUPABASE_URL, SUPABASE_KEY);

async function signInWithEmail() {
  console.log(`Trying to log in ${document.getElementById("email").value}`)
  const { user, error } = await client.auth.signIn({
    email: document.getElementById("email").value
  })
  console.log(user);
  console.log(error);
}
</script>

This is hosted on localhost:8000 and supabase is configured to send a magic link with a re-direct. The redirect works ... I briefly see extra info in the URL, but how does the user actually get authenticated? The docs (https://supabase.com/docs/guides/auth/auth-magic-link) suggest that I merely need to call

.auth.signIn

.auth.signIn

but that's the same method that I used to send the email?

Is there an example of basic email authentication that uses vanilla JS with supabase hosted via CDN.

Use Supabase to Authenticate and Authorize your users using Magic Link.

Magic Email Links and CDN

I figured I'd give supabase a try locally. I have the following code:

<script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js"></script>

email
<input type="text" id="email">
<button onclick="signInWithEmail()">signin</button>

<script>
const SUPABASE_KEY = 'xxx'
const SUPABASE_URL = "yyy"
const client = supabase.createClient(SUPABASE_URL, SUPABASE_KEY);

async function signInWithEmail() {
  console.log(`Trying to log in ${document.getElementById("email").value}`)
  const { user, error } = await client.auth.signIn({
    email: document.getElementById("email").value
  })
  console.log(user);
  console.log(error);
}
</script>

<script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js"></script>

email
<input type="text" id="email">
<button onclick="signInWithEmail()">signin</button>

<script>
const SUPABASE_KEY = 'xxx'
const SUPABASE_URL = "yyy"
const client = supabase.createClient(SUPABASE_URL, SUPABASE_KEY);

async function signInWithEmail() {
  console.log(`Trying to log in ${document.getElementById("email").value}`)
  const { user, error } = await client.auth.signIn({
    email: document.getElementById("email").value
  })
  console.log(user);
  console.log(error);
}
</script>

.auth.signIn

.auth.signIn

but that's the same method that I used to send the email?

Is there an example of basic email authentication that uses vanilla JS with supabase hosted via CDN.

Use Supabase to Authenticate and Authorize your users using Magic Link.

Magic Email Links and CDN

Similar Threads

Magic Email Links and CDN

Similar Threads

Similar Threads

Similar Threads