How to get access token from Supabase auth?

liweihan · November 12, 2022, 7:59am

Hi,
Im trying to use the graphQL endpoint of Supabase with the Supabase Auth plugin. In order to fetch the graphQL endpoint on behalf of a user I need to provide Bearer auth header similar as what this example project is doing:

github.com

supabase-community/supabase-graphql-example/blob/main/app/lib/urql.tsx

import React from "react";
import { createClient, Provider } from "urql";
import { useSupabaseClient } from "./supabase";

export function UrqlProvider(props: { children: React.ReactNode }) {
  const supabaseClient = useSupabaseClient();

  function getHeaders(): Record<string, string> {
    const headers: Record<string, string> = {
      apikey: process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
    };
    const authorization = supabaseClient.auth.session()?.access_token;

    if (authorization) {
      headers["authorization"] = `Bearer ${authorization}`;
    }

    return headers;
  }

This file has been truncated. show original

The question is how do I get such Bearer access token with Weweb Supabase auth?

Thank You!

tompatros · November 19, 2022, 4:05am

@liweihan I’m not sure if I’m doing it right either, but while reviewing the cookies created by WeWeb, I was able to find a “sb-access-token” if I was logged in as a Supabase user. This cookie is not present if the user is anonymous. I wrote some JS to check for and pull out this cookie’s value if present and I have been able to pass it in the Authorization header successfully to a Supabase Edge Function. Note that I’ve only tested this while in the editor. I haven’t published an app yet so I haven’t tested in that context.

WeWeb smart people: is using the “sb-access-token” access a good idea or a bad idea?

Alexis · November 22, 2022, 9:35am

Hi, you can access it from wwLib.wwPlugins.supabaseAuth.settings.publicData.apiKey

It’s the public api key so you can access it from the public settings of the plugin.

@liweihan You could use the cookie but it’s not a great idea because we could update it and create unpredictable regression in your project (and we will because we recently found a limitation, we will attach a project id to the cookie name)

tompatros · November 26, 2022, 6:15pm

Thank you @Alexis ! Is there some place where all settings in wwLib / wwPlugins are listed? I tried looking around https://developer.weweb.io/ but had no luck.

aurelie · November 28, 2022, 12:24pm

The documentation is planned to be rewrite to have much more information.
In this specific usecase, this is link to the plugin itself, so i am taking note that having dev document for plugin is also a think to have in mind

liweihan · December 1, 2022, 1:44pm

This works, thank you all!

liweihan · December 30, 2022, 5:51am

apiKey is static so that’s actually not what Im looking for. access token which starts with Bearer is what Im looking for.

shaobsh · January 10, 2023, 6:48pm

@liweihan were you able to figure out where to find the access token?

check out this other discussion i started:

Topic		Replies	Views
Regression: REST Request Missing Authorization Header in Preview Mode Ask us anything authentication	3	425	July 31, 2023
Using Outseta for auth (token-based auth plugin) and exchanging an Outseta-signed JWT for a Supabased-signed JWT in WeWeb How do I? authentication , supabase	4	391	July 24, 2023
WeWeb / Supabase auth issue Ask us anything supabase	12	447	April 30, 2024
Is there a way to set the Supabase auth token manually? How do I?	9	1790	February 17, 2024
Google Calendar API with Supabase How do I? authentication , supabase	7	1284	October 20, 2023

How to get access token from Supabase auth?

Related topics