Theo's Typesafe CultTTC
Theo's Typesafe Cult•3y ago•
1 reply
juanvilladev

Not sure if data is being exposed to the client

Hello team, I have the following Supabase JS client which should not be exposed to the client.
// pages/api/supabase.ts
import type { SupabaseClient} from "@supabase/supabase-js";
import { createClient } from "@supabase/supabase-js";

const supabase: SupabaseClient = createClient(
    process.env.SUPABASE_URL!,
    process.env.SUPABASE_ANON_KEY!
)

export default supabase;


I then import this into my server side rendered components like this:
import supabase from '../api/supabase';

export const getServerSideProps = async () => {
    const { data: customers, error } = await supabase.from('customer').select('*');
    if (error) throw new Error(error.message);
    return {
        props: {
            customers
        }
    }
}

const ServerRenderedComp = ({ customers }: { customers: any }) => {
  return (
    <>
      <p>Vendors!</p>
      <pre>{JSON.stringify(customers, null, 2)}</pre>
    </>
  )
}

export default ServerRenderedComp


I want to ensure that the Supabase client and more importantly the SUPABASE_URL and SUPABASE_ANON_KEY values aren't being exposed. Is this the safe way to do it?
Was this page helpful?