Supabase Reference (JavaScript)

# JavaScript Reference

Initializing

You can initialize a new Supabase client using the `createClient()` method.

The Supabase client is your entrypoint to the rest of the Supabase functionality
and is the easiest way to interact with everything we offer within the Supabase ecosystem.


## Examples

### Creating a client

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

// Create a single supabase client for interacting with your database
const supabase = createClient('https://xyzcompany.supabase.co', 'public-anon-key')
```


### With a custom domain

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

// Use a custom domain as the supabase URL
const supabase = createClient('https://my-custom-domain.com', 'public-anon-key')
```


### With additional parameters

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

const options = {
  db: {
    schema: 'public',
  },
  auth: {
    autoRefreshToken: true,
    persistSession: true,
    detectSessionInUrl: true
  },
  global: {
    headers: { 'x-my-custom-header': 'my-app-name' },
  },
}
const supabase = createClient("https://xyzcompany.supabase.co", "public-anon-key", options)
```


### With custom schemas

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

const supabase = createClient('https://xyzcompany.supabase.co', 'public-anon-key', {
  // Provide a custom schema. Defaults to "public".
  db: { schema: 'other_schema' }
})
```


### Custom fetch implementation

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

const supabase = createClient('https://xyzcompany.supabase.co', 'public-anon-key', {
  global: { fetch: fetch.bind(globalThis) }
})
```


### React Native options with AsyncStorage

```js
import 'react-native-url-polyfill/auto'
import { createClient } from '@supabase/supabase-js'
import AsyncStorage from "@react-native-async-storage/async-storage";

const supabase = createClient("https://xyzcompany.supabase.co", "public-anon-key", {
  auth: {
    storage: AsyncStorage,
    autoRefreshToken: true,
    persistSession: true,
    detectSessionInUrl: false,
  },
});
```


### React Native options with Expo SecureStore

```js
import 'react-native-url-polyfill/auto'
import { createClient } from '@supabase/supabase-js'
import AsyncStorage from '@react-native-async-storage/async-storage';
import * as SecureStore from 'expo-secure-store';
import * as aesjs from 'aes-js';
import 'react-native-get-random-values';

// As Expo's SecureStore does not support values larger than 2048
// bytes, an AES-256 key is generated and stored in SecureStore, while
// it is used to encrypt/decrypt values stored in AsyncStorage.
class LargeSecureStore {
  private async _encrypt(key: string, value: string) {
    const encryptionKey = crypto.getRandomValues(new Uint8Array(256 / 8));

    const cipher = new aesjs.ModeOfOperation.ctr(encryptionKey, new aesjs.Counter(1));
    const encryptedBytes = cipher.encrypt(aesjs.utils.utf8.toBytes(value));

    await SecureStore.setItemAsync(key, aesjs.utils.hex.fromBytes(encryptionKey));

    return aesjs.utils.hex.fromBytes(encryptedBytes);
  }

  private async _decrypt(key: string, value: string) {
    const encryptionKeyHex = await SecureStore.getItemAsync(key);
    if (!encryptionKeyHex) {
      return encryptionKeyHex;
    }

    const cipher = new aesjs.ModeOfOperation.ctr(aesjs.utils.hex.toBytes(encryptionKeyHex), new aesjs.Counter(1));
    const decryptedBytes = cipher.decrypt(aesjs.utils.hex.toBytes(value));

    return aesjs.utils.utf8.fromBytes(decryptedBytes);
  }

  async getItem(key: string) {
    const encrypted = await AsyncStorage.getItem(key);
    if (!encrypted) { return encrypted; }

    return await this._decrypt(key, encrypted);
  }

  async removeItem(key: string) {
    await AsyncStorage.removeItem(key);
    await SecureStore.deleteItemAsync(key);
  }

  async setItem(key: string, value: string) {
    const encrypted = await this._encrypt(key, value);

    await AsyncStorage.setItem(key, encrypted);
  }
}

const supabase = createClient("https://xyzcompany.supabase.co", "public-anon-key", {
  auth: {
    storage: new LargeSecureStore(),
    autoRefreshToken: true,
    persistSession: true,
    detectSessionInUrl: false,
  },
});
```


# JavaScript Reference

Fetch data: select()



## Examples

### Getting your data

```js
const { data, error } = await supabase
  .from('characters')
  .select()
```


### Selecting specific columns

```js
const { data, error } = await supabase
  .from('characters')
  .select('name')
```


### Query referenced tables

```js
const { data, error } = await supabase
  .from('orchestal_sections')
  .select(`
    name,
    instruments (
      name
    )
  `)
```


### Query referenced tables with spaces in their names

```js
const { data, error } = await supabase
  .from('orchestal sections')
  .select(`
    name,
    "musical instruments" (
      name
    )
  `)
```


### Query referenced tables through a join table

```ts
const { data, error } = await supabase
  .from('users')
  .select(`
    name,
    teams (
      name
    )
  `)
  ```


### Query the same referenced table multiple times

```ts
const { data, error } = await supabase
  .from('messages')
  .select(`
    content,
    from:sender_id(name),
    to:receiver_id(name)
  `)

// To infer types, use the name of the table (in this case `users`) and
// the name of the foreign key constraint.
const { data, error } = await supabase
  .from('messages')
  .select(`
    content,
    from:users!messages_sender_id_fkey(name),
    to:users!messages_receiver_id_fkey(name)
  `)
```


### Query nested foreign tables through a join table

```ts
  const { data, error } = await supabase
    .from('games')
    .select(`
      game_id:id,
      away_team:teams!games_away_team_fkey (
        users (
          id,
          name
        )
      )
    `)
  ```


### Filtering through referenced tables

```ts
const { data, error } = await supabase
  .from('instruments')
  .select('name, orchestral_sections(*)')
  .eq('orchestral_sections.name', 'percussion')
```


### Querying referenced table with count

```ts
const { data, error } = await supabase
  .from('orchestral_sections')
  .select(`*, instruments(count)`)
```


### Querying with count option

```ts
const { count, error } = await supabase
  .from('characters')
  .select('*', { count: 'exact', head: true })
```


### Querying JSON data

```ts
const { data, error } = await supabase
  .from('users')
  .select(`
    id, name,
    address->city
  `)
```


### Querying referenced table with inner join

```ts
const { data, error } = await supabase
  .from('instruments')
  .select('name, orchestral_sections!inner(name)')
  .eq('orchestral_sections.name', 'woodwinds')
  .limit(1)
```


### Switching schemas per query

```ts
const { data, error } = await supabase
  .schema('myschema')
  .from('mytable')
  .select()
```


# JavaScript Reference

Create data: insert()



## Examples

### Create a record

```ts
const { error } = await supabase
  .from('countries')
  .insert({ id: 1, name: 'Mordor' })
```


### Create a record and return it

```ts
const { data, error } = await supabase
  .from('countries')
  .insert({ id: 1, name: 'Mordor' })
  .select()
```


### Bulk create

```ts
const { error } = await supabase
  .from('countries')
  .insert([
    { id: 1, name: 'Mordor' },
    { id: 1, name: 'The Shire' },
  ])
```


# JavaScript Reference

Modify data: update()



## Examples

### Updating your data

```ts
const { error } = await supabase
  .from('instruments')
  .update({ name: 'piano' })
  .eq('id', 1)
```


### Update a record and return it

```ts
const { data, error } = await supabase
  .from('instruments')
  .update({ name: 'piano' })
  .eq('id', 1)
  .select()
```


### Updating JSON data

```ts
const { data, error } = await supabase
  .from('users')
  .update({
    address: {
      street: 'Melrose Place',
      postcode: 90210
    }
  })
  .eq('address->postcode', 90210)
  .select()
```


# JavaScript Reference

Upsert data: upsert()



## Examples

### Upsert your data

```ts
const { data, error } = await supabase
  .from('instruments')
  .upsert({ id: 1, name: 'piano' })
  .select()
```


### Bulk Upsert your data

```ts
const { data, error } = await supabase
  .from('instruments')
  .upsert([
    { id: 1, name: 'piano' },
    { id: 2, name: 'harp' },
  ])
  .select()
```


### Upserting into tables with constraints

```ts
const { data, error } = await supabase
  .from('users')
  .upsert({ id: 42, handle: 'saoirse', display_name: 'Saoirse' }, { onConflict: 'handle' })
  .select()
```


# JavaScript Reference

Delete data: delete()



## Examples

### Delete a single record

```ts
const response = await supabase
  .from('countries')
  .delete()
  .eq('id', 1)
```


### Delete a record and return it

```ts
const { data, error } = await supabase
  .from('countries')
  .delete()
  .eq('id', 1)
  .select()
```


### Delete multiple records

```ts
const response = await supabase
  .from('countries')
  .delete()
  .in('id', [1, 2, 3])
```


# JavaScript Reference

Postgres functions: rpc()

You can call Postgres functions as _Remote Procedure Calls_, logic in your database that you can execute from anywhere.
Functions are useful when the logic rarely changes—like for password resets and updates.

```sql
create or replace function hello_world() returns text as $$
  select 'Hello world';
$$ language sql;
```

To call Postgres functions on [Read Replicas](/docs/guides/platform/read-replicas), use the `get: true` option.


## Examples

### Call a Postgres function without arguments

```ts
const { data, error } = await supabase.rpc('hello_world')
```


### Call a Postgres function with arguments

```ts
const { data, error } = await supabase.rpc('echo', { say: '👋' })
```


### Bulk processing

```ts
const { data, error } = await supabase.rpc('add_one_each', { arr: [1, 2, 3] })
```


### Call a Postgres function with filters

```ts
const { data, error } = await supabase
  .rpc('list_stored_countries')
  .eq('id', 1)
  .single()
```


### Call a read-only Postgres function

```ts
const { data, error } = await supabase.rpc('hello_world', { get: true })
```


# JavaScript Reference

Using Filters

Filters allow you to only return rows that match certain conditions.

Filters can be used on `select()`, `update()`, `upsert()`, and `delete()` queries.

If a Postgres function returns a table response, you can also apply filters.


## Examples

### Applying Filters

```ts
const { data, error } = await supabase
  .from('instruments')
  .select('name, section_id')
  .eq('name', 'violin')    // Correct

const { data, error } = await supabase
  .from('instruments')
  .eq('name', 'violin')    // Incorrect
  .select('name, section_id')
```


### Chaining

```ts
const { data, error } = await supabase
  .from('cities')
  .select('name, country_id')
  .gte('population', 1000)
  .lt('population', 10000)
```


### Conditional Chaining

```ts
const filterByName = null
const filterPopLow = 1000
const filterPopHigh = 10000

let query = supabase
  .from('cities')
  .select('name, country_id')

if (filterByName)  { query = query.eq('name', filterByName) }
if (filterPopLow)  { query = query.gte('population', filterPopLow) }
if (filterPopHigh) { query = query.lt('population', filterPopHigh) }

const { data, error } = await query
```


### Filter by values within a JSON column

```ts
const { data, error } = await supabase
  .from('users')
  .select()
  .eq('address->postcode', 90210)
```


### Filter referenced tables

```ts
const { data, error } = await supabase
  .from('orchestral_sections')
  .select(`
    name,
    instruments!inner (
      name
    )
  `)
  .eq('instruments.name', 'flute')
```


# JavaScript Reference

eq()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .eq('name', 'Leia')
```


# JavaScript Reference

neq()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .neq('name', 'Leia')
```


# JavaScript Reference

gt()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .gt('id', 2)
```


# JavaScript Reference

gte()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .gte('id', 2)
```


# JavaScript Reference

lt()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .lt('id', 2)
```


# JavaScript Reference

lte()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .lte('id', 2)
```


# JavaScript Reference

like()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .like('name', '%Lu%')
```


# JavaScript Reference

ilike()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .ilike('name', '%lu%')
```


# JavaScript Reference

is()



## Examples

### Checking for nullness, true or false

```ts
const { data, error } = await supabase
  .from('countries')
  .select()
  .is('name', null)
```


# JavaScript Reference

in()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .in('name', ['Leia', 'Han'])
```


# JavaScript Reference

contains()



## Examples

### On array columns

```ts
const { data, error } = await supabase
  .from('issues')
  .select()
  .contains('tags', ['is:open', 'priority:low'])
```


### On range columns

```ts
const { data, error } = await supabase
  .from('reservations')
  .select()
  .contains('during', '[2000-01-01 13:00, 2000-01-01 13:30)')
```


### On `jsonb` columns

```ts
const { data, error } = await supabase
  .from('users')
  .select('name')
  .contains('address', { postcode: 90210 })
```


# JavaScript Reference

containedBy()



## Examples

### On array columns

```ts
const { data, error } = await supabase
  .from('classes')
  .select('name')
  .containedBy('days', ['monday', 'tuesday', 'wednesday', 'friday'])
```


### On range columns

```ts
const { data, error } = await supabase
  .from('reservations')
  .select()
  .containedBy('during', '[2000-01-01 00:00, 2000-01-01 23:59)')
```


### On `jsonb` columns

```ts
const { data, error } = await supabase
  .from('users')
  .select('name')
  .containedBy('address', {})
```


# JavaScript Reference

rangeGt()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('reservations')
  .select()
  .rangeGt('during', '[2000-01-02 08:00, 2000-01-02 09:00)')
```


# JavaScript Reference

rangeGte()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('reservations')
  .select()
  .rangeGte('during', '[2000-01-02 08:30, 2000-01-02 09:30)')
```


# JavaScript Reference

rangeLt()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('reservations')
  .select()
  .rangeLt('during', '[2000-01-01 15:00, 2000-01-01 16:00)')
```


# JavaScript Reference

rangeLte()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('reservations')
  .select()
  .rangeLte('during', '[2000-01-01 14:00, 2000-01-01 16:00)')
```


# JavaScript Reference

rangeAdjacent()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('reservations')
  .select()
  .rangeAdjacent('during', '[2000-01-01 12:00, 2000-01-01 13:00)')
```


# JavaScript Reference

overlaps()



## Examples

### On array columns

```ts
const { data, error } = await supabase
  .from('issues')
  .select('title')
  .overlaps('tags', ['is:closed', 'severity:high'])
```


### On range columns

```ts
const { data, error } = await supabase
  .from('reservations')
  .select()
  .overlaps('during', '[2000-01-01 12:45, 2000-01-01 13:15)')
```


# JavaScript Reference

textSearch()



## Examples

### Text search

```ts
const result = await supabase
  .from("texts")
  .select("content")
  .textSearch("content", `'eggs' & 'ham'`, {
    config: "english",
  });
```


### Basic normalization

```ts
const { data, error } = await supabase
  .from('quotes')
  .select('catchphrase')
  .textSearch('catchphrase', `'fat' & 'cat'`, {
    type: 'plain',
    config: 'english'
  })
```


### Full normalization

```ts
const { data, error } = await supabase
  .from('quotes')
  .select('catchphrase')
  .textSearch('catchphrase', `'fat' & 'cat'`, {
    type: 'phrase',
    config: 'english'
  })
```


### Websearch

```ts
const { data, error } = await supabase
  .from('quotes')
  .select('catchphrase')
  .textSearch('catchphrase', `'fat or cat'`, {
    type: 'websearch',
    config: 'english'
  })
```


# JavaScript Reference

match()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select('name')
  .match({ id: 2, name: 'Leia' })
```


# JavaScript Reference

not()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('countries')
  .select()
  .not('name', 'is', null)
```


# JavaScript Reference

or()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select('name')
  .or('id.eq.2,name.eq.Han')
```


### Use `or` with `and`

```ts
const { data, error } = await supabase
  .from('characters')
  .select('name')
  .or('id.gt.3,and(id.eq.1,name.eq.Luke)')
```


### Use `or` on referenced tables

```ts
const { data, error } = await supabase
  .from('orchestral_sections')
  .select(`
    name,
    instruments!inner (
      name
    )
  `)
  .or('section_id.eq.1,name.eq.guzheng', { referencedTable: 'instruments' })
```


# JavaScript Reference

filter()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .filter('name', 'in', '("Han","Yoda")')
```


### On a referenced table

```ts
const { data, error } = await supabase
  .from('orchestral_sections')
  .select(`
    name,
    instruments!inner (
      name
    )
  `)
  .filter('instruments.name', 'eq', 'flute')
```


# JavaScript Reference

Using Modifiers

Filters work on the row level—they allow you to return rows that
only match certain conditions without changing the shape of the rows.
Modifiers are everything that don't fit that definition—allowing you to
change the format of the response (e.g., returning a CSV string).

Modifiers must be specified after filters. Some modifiers only apply for
queries that return rows (e.g., `select()` or `rpc()` on a function that
returns a table response).


## Examples



# JavaScript Reference

select()



## Examples

### With `upsert()`

```ts
const { data, error } = await supabase
  .from('characters')
  .upsert({ id: 1, name: 'Han Solo' })
  .select()
```


# JavaScript Reference

order()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select('id, name')
  .order('id', { ascending: false })
```


### On a referenced table

```ts
  const { data, error } = await supabase
    .from('orchestral_sections')
    .select(`
      name,
      instruments (
        name
      )
    `)
    .order('name', { referencedTable: 'instruments', ascending: false })
  ```


### Order parent table by a referenced table

```ts
  const { data, error } = await supabase
    .from('instruments')
    .select(`
      name,
      section:orchestral_sections (
        name
      )
    `)
    .order('section(name)', { ascending: true })
  ```


# JavaScript Reference

limit()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select('name')
  .limit(1)
```


### On a referenced table

```ts
const { data, error } = await supabase
  .from('orchestral_sections')
  .select(`
    name,
    instruments (
      name
    )
  `)
  .limit(1, { referencedTable: 'instruments' })
```


# JavaScript Reference

range()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('countries')
  .select('name')
  .range(0, 1)
```


# JavaScript Reference

abortSignal()



## Examples

### Aborting requests in-flight

```ts
const ac = new AbortController()
ac.abort()
const { data, error } = await supabase
  .from('very_big_table')
  .select()
  .abortSignal(ac.signal)
```


### Set a timeout

```ts
const { data, error } = await supabase
  .from('very_big_table')
  .select()
  .abortSignal(AbortSignal.timeout(1000 /* ms */))
```


# JavaScript Reference

single()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select('name')
  .limit(1)
  .single()
```


# JavaScript Reference

maybeSingle()



## Examples

### With `select()`

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .eq('name', 'Katniss')
  .maybeSingle()
```


# JavaScript Reference

csv()



## Examples

### Return data as CSV

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .csv()
```


# JavaScript Reference

returns()



## Examples

### Override type of successful response

```ts
const { data } = await supabase
  .from('countries')
  .select()
  .returns<Array<MyType>>()
```


### Override type of object response

```ts
const { data } = await supabase
  .from('countries')
  .select()
  .maybeSingle()
  .returns<MyType>()
```


# JavaScript Reference

overrideTypes()



## Examples

### Complete Override type of successful response

```ts
const { data } = await supabase
  .from('countries')
  .select()
  .overrideTypes<Array<MyType>, { merge: false }>()
```


### Complete Override type of object response

```ts
const { data } = await supabase
  .from('countries')
  .select()
  .maybeSingle()
  .overrideTypes<MyType, { merge: false }>()
```


### Partial Override type of successful response

```ts
const { data } = await supabase
  .from('countries')
  .select()
  .overrideTypes<Array<{ status: "A" | "B" }>>()
```


### Partial Override type of object response

```ts
const { data } = await supabase
  .from('countries')
  .select()
  .maybeSingle()
  .overrideTypes<{ status: "A" | "B" }>()
```


# JavaScript Reference

Using Explain

For debugging slow queries, you can get the [Postgres `EXPLAIN` execution plan](https://www.postgresql.org/docs/current/sql-explain.html) of a query
using the `explain()` method. This works on any query, even for `rpc()` or writes.

Explain is not enabled by default as it can reveal sensitive information about your database.
It's best to only enable this for testing environments but if you wish to enable it for production you can provide additional protection by using a `pre-request` function.

Follow the [Performance Debugging Guide](/docs/guides/database/debugging-performance) to enable the functionality on your project.


## Examples

### Get the execution plan

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .explain()
```


### Get the execution plan with analyze and verbose

```ts
const { data, error } = await supabase
  .from('characters')
  .select()
  .explain({analyze:true,verbose:true})
```


# JavaScript Reference

Overview



## Examples

### Create auth client

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

const supabase = createClient(supabase_url, anon_key)
```


### Create auth client (server-side)

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

const supabase = createClient(supabase_url, anon_key, {
  auth: {
    autoRefreshToken: false,
    persistSession: false,
    detectSessionInUrl: false
  }
})
```


# JavaScript Reference

signUp()



## Examples

### Sign up with an email and password

```js
const { data, error } = await supabase.auth.signUp({
  email: 'example@email.com',
  password: 'example-password',
})
```


### Sign up with a phone number and password (SMS)

```js
const { data, error } = await supabase.auth.signUp({
  phone: '123456789',
  password: 'example-password',
  options: {
    channel: 'sms'
  }
})
```


### Sign up with a phone number and password (whatsapp)

```js
const { data, error } = await supabase.auth.signUp({
  phone: '123456789',
  password: 'example-password',
  options: {
    channel: 'whatsapp'
  }
})
```


### Sign up with additional user metadata

```js
const { data, error } = await supabase.auth.signUp(
  {
    email: 'example@email.com',
    password: 'example-password',
    options: {
      data: {
        first_name: 'John',
        age: 27,
      }
    }
  }
)
```


### Sign up with a redirect URL

```js
const { data, error } = await supabase.auth.signUp(
  {
    email: 'example@email.com',
    password: 'example-password',
    options: {
      emailRedirectTo: 'https://example.com/welcome'
    }
  }
)
```


# JavaScript Reference

onAuthStateChange()



## Examples

### Listen to auth changes

```js
const { data } = supabase.auth.onAuthStateChange((event, session) => {
  console.log(event, session)

  if (event === 'INITIAL_SESSION') {
    // handle initial session
  } else if (event === 'SIGNED_IN') {
    // handle sign in event
  } else if (event === 'SIGNED_OUT') {
    // handle sign out event
  } else if (event === 'PASSWORD_RECOVERY') {
    // handle password recovery event
  } else if (event === 'TOKEN_REFRESHED') {
    // handle token refreshed event
  } else if (event === 'USER_UPDATED') {
    // handle user updated event
  }
})

// call unsubscribe to remove the callback
data.subscription.unsubscribe()
```


### Listen to sign out

```js
supabase.auth.onAuthStateChange((event, session) => {
  if (event === 'SIGNED_OUT') {
    console.log('SIGNED_OUT', session)

    // clear local and session storage
    [
      window.localStorage,
      window.sessionStorage,
    ].forEach((storage) => {
      Object.entries(storage)
        .forEach(([key]) => {
          storage.removeItem(key)
        })
    })
  }
})
```


### Store OAuth provider tokens on sign in

```js
// Register this immediately after calling createClient!
// Because signInWithOAuth causes a redirect, you need to fetch the
// provider tokens from the callback.
supabase.auth.onAuthStateChange((event, session) => {
  if (session && session.provider_token) {
    window.localStorage.setItem('oauth_provider_token', session.provider_token)
  }

  if (session && session.provider_refresh_token) {
    window.localStorage.setItem('oauth_provider_refresh_token', session.provider_refresh_token)
  }

  if (event === 'SIGNED_OUT') {
    window.localStorage.removeItem('oauth_provider_token')
    window.localStorage.removeItem('oauth_provider_refresh_token')
  }
})
```


### Use React Context for the User's session

```js
const SessionContext = React.createContext(null)

function main() {
  const [session, setSession] = React.useState(null)

  React.useEffect(() => {
    const {data: { subscription }} = supabase.auth.onAuthStateChange(
      (event, session) => {
        if (event === 'SIGNED_OUT') {
          setSession(null)
        } else if (session) {
          setSession(session)
        }
      })

    return () => {
      subscription.unsubscribe()
    }
  }, [])

  return (
    <SessionContext.Provider value={session}>
      <App />
    </SessionContext.Provider>
  )
}
```


### Listen to password recovery events

```js
supabase.auth.onAuthStateChange((event, session) => {
  if (event === 'PASSWORD_RECOVERY') {
    console.log('PASSWORD_RECOVERY', session)
    // show screen to update user's password
    showPasswordResetScreen(true)
  }
})
```


### Listen to sign in

```js
supabase.auth.onAuthStateChange((event, session) => {
  if (event === 'SIGNED_IN') console.log('SIGNED_IN', session)
})
```


### Listen to token refresh

```js
supabase.auth.onAuthStateChange((event, session) => {
  if (event === 'TOKEN_REFRESHED') console.log('TOKEN_REFRESHED', session)
})
```


### Listen to user updates

```js
supabase.auth.onAuthStateChange((event, session) => {
  if (event === 'USER_UPDATED') console.log('USER_UPDATED', session)
})
```


# JavaScript Reference

signInAnonymously()



## Examples

### Create an anonymous user

```js
const { data, error } = await supabase.auth.signInAnonymously({
  options: {
    captchaToken
  }
});
```


### Create an anonymous user with custom user metadata

```js
const { data, error } = await supabase.auth.signInAnonymously({
  options: {
    data
  }
})
```


# JavaScript Reference

signInWithPassword()



## Examples

### Sign in with email and password

```js
const { data, error } = await supabase.auth.signInWithPassword({
  email: 'example@email.com',
  password: 'example-password',
})
```


### Sign in with phone and password

```js
const { data, error } = await supabase.auth.signInWithPassword({
  phone: '+13334445555',
  password: 'some-password',
})
```


# JavaScript Reference

signInWithIdToken



## Examples

### Sign In using ID Token

```js
const { data, error } = await supabase.auth.signInWithIdToken({
  provider: 'google',
  token: 'your-id-token'
})
```


# JavaScript Reference

signInWithOtp()



## Examples

### Sign in with email

```js
const { data, error } = await supabase.auth.signInWithOtp({
  email: 'example@email.com',
  options: {
    emailRedirectTo: 'https://example.com/welcome'
  }
})
```


### Sign in with SMS OTP

```js
const { data, error } = await supabase.auth.signInWithOtp({
  phone: '+13334445555',
})
```


### Sign in with WhatsApp OTP

```js
const { data, error } = await supabase.auth.signInWithOtp({
  phone: '+13334445555',
  options: {
    channel:'whatsapp',
  }
})
```


# JavaScript Reference

signInWithOAuth()



## Examples

### Sign in using a third-party provider

```js
const { data, error } = await supabase.auth.signInWithOAuth({
  provider: 'github'
})
```


### Sign in using a third-party provider with redirect

```js
const { data, error } = await supabase.auth.signInWithOAuth({
  provider: 'github',
  options: {
    redirectTo: 'https://example.com/welcome'
  }
})
```


### Sign in with scopes and access provider tokens

```js
// Register this immediately after calling createClient!
// Because signInWithOAuth causes a redirect, you need to fetch the
// provider tokens from the callback.
supabase.auth.onAuthStateChange((event, session) => {
  if (session && session.provider_token) {
    window.localStorage.setItem('oauth_provider_token', session.provider_token)
  }

  if (session && session.provider_refresh_token) {
    window.localStorage.setItem('oauth_provider_refresh_token', session.provider_refresh_token)
  }

  if (event === 'SIGNED_OUT') {
    window.localStorage.removeItem('oauth_provider_token')
    window.localStorage.removeItem('oauth_provider_refresh_token')
  }
})

// Call this on your Sign in with GitHub button to initiate OAuth
// with GitHub with the requested elevated scopes.
await supabase.auth.signInWithOAuth({
  provider: 'github',
  options: {
    scopes: 'repo gist notifications'
  }
})
```


# JavaScript Reference

signInWithSSO()



## Examples

### Sign in with email domain

```js
  // You can extract the user's email domain and use it to trigger the
  // authentication flow with the correct identity provider.

  const { data, error } = await supabase.auth.signInWithSSO({
    domain: 'company.com'
  })

  if (data?.url) {
    // redirect the user to the identity provider's authentication flow
    window.location.href = data.url
  }
```


### Sign in with provider UUID

```js
  // Useful when you need to map a user's sign in request according
  // to different rules that can't use email domains.

  const { data, error } = await supabase.auth.signInWithSSO({
    providerId: '21648a9d-8d5a-4555-a9d1-d6375dc14e92'
  })

  if (data?.url) {
    // redirect the user to the identity provider's authentication flow
    window.location.href = data.url
  }
```


# JavaScript Reference

signOut()



## Examples

### Sign out

```js
const { error } = await supabase.auth.signOut()
```


# JavaScript Reference

resetPasswordForEmail()



## Examples

### Reset password

```js
const { data, error } = await supabase.auth.resetPasswordForEmail(email, {
  redirectTo: 'https://example.com/update-password',
})
```


### Reset password (React)

```js
/**
 * Step 1: Send the user an email to get a password reset token.
 * This email contains a link which sends the user back to your application.
 */
const { data, error } = await supabase.auth
  .resetPasswordForEmail('user@email.com')

/**
 * Step 2: Once the user is redirected back to your application,
 * ask the user to reset their password.
 */
 useEffect(() => {
   supabase.auth.onAuthStateChange(async (event, session) => {
     if (event == "PASSWORD_RECOVERY") {
       const newPassword = prompt("What would you like your new password to be?");
       const { data, error } = await supabase.auth
         .updateUser({ password: newPassword })

       if (data) alert("Password updated successfully!")
       if (error) alert("There was an error updating your password.")
     }
   })
 }, [])
```


# JavaScript Reference

verifyOtp()



## Examples

### Verify Signup One-Time Password (OTP)

```js
const { data, error } = await supabase.auth.verifyOtp({ email, token, type: 'email'})
```


### Verify Sms One-Time Password (OTP)

```js
const { data, error } = await supabase.auth.verifyOtp({ phone, token, type: 'sms'})
```


### Verify Email Auth (Token Hash)

```js
const { data, error } = await supabase.auth.verifyOtp({ token_hash: tokenHash, type: 'email'})
```


# JavaScript Reference

getSession()



## Examples

### Get the session data

```js
const { data, error } = await supabase.auth.getSession()
```


# JavaScript Reference

refreshSession()



## Examples

### Refresh session using the current session

```js
const { data, error } = await supabase.auth.refreshSession()
const { session, user } = data
```


### Refresh session using a refresh token

```js
const { data, error } = await supabase.auth.refreshSession({ refresh_token })
const { session, user } = data
```


# JavaScript Reference

getUser()



## Examples

### Get the logged in user with the current existing session

```js
const { data: { user } } = await supabase.auth.getUser()
```


### Get the logged in user with a custom access token jwt

```js
const { data: { user } } = await supabase.auth.getUser(jwt)
```


# JavaScript Reference

updateUser()



## Examples

### Update the email for an authenticated user

```js
const { data, error } = await supabase.auth.updateUser({
  email: 'new@email.com'
})
```


### Update the phone number for an authenticated user

```js
const { data, error } = await supabase.auth.updateUser({
  phone: '123456789'
})
```


### Update the password for an authenticated user

```js
const { data, error } = await supabase.auth.updateUser({
  password: 'new password'
})
```


### Update the user's metadata

```js
const { data, error } = await supabase.auth.updateUser({
  data: { hello: 'world' }
})
```


### Update the user's password with a nonce

```js
const { data, error } = await supabase.auth.updateUser({
  password: 'new password',
  nonce: '123456'
})
```


# JavaScript Reference

getUserIdentities()



## Examples

### Returns a list of identities linked to the user

```js
const { data, error } = await supabase.auth.getUserIdentities()
```


# JavaScript Reference

linkIdentity()



## Examples

### Link an identity to a user

```js
const { data, error } = await supabase.auth.linkIdentity({
  provider: 'github'
})
```


# JavaScript Reference

unlinkIdentity()



## Examples

### Unlink an identity

```js
// retrieve all identites linked to a user
const identities = await supabase.auth.getUserIdentities()

// find the google identity
const googleIdentity = identities.find(
  identity => identity.provider === 'google'
)

// unlink the google identity
const { error } = await supabase.auth.unlinkIdentity(googleIdentity)
```


# JavaScript Reference

reauthenticate()



## Examples

### Send reauthentication nonce

```js
const { error } = await supabase.auth.reauthenticate()
```


# JavaScript Reference

resend()



## Examples

### Resend an email signup confirmation

```js
const { error } = await supabase.auth.resend({
  type: 'signup',
  email: 'email@example.com',
  options: {
    emailRedirectTo: 'https://example.com/welcome'
  }
})
```


### Resend a phone signup confirmation

```js
const { error } = await supabase.auth.resend({
  type: 'sms',
  phone: '1234567890'
})
```


### Resend email change email

```js
const { error } = await supabase.auth.resend({
  type: 'email_change',
  email: 'email@example.com'
})
```


### Resend phone change OTP

```js
const { error } = await supabase.auth.resend({
  type: 'phone_change',
  phone: '1234567890'
})
```


# JavaScript Reference

setSession()



## Examples

### Set the session

```js
  const { data, error } = await supabase.auth.setSession({
    access_token,
    refresh_token
  })
```


# JavaScript Reference

exchangeCodeForSession()



## Examples

### Exchange Auth Code

```js
supabase.auth.exchangeCodeForSession('34e770dd-9ff9-416c-87fa-43b31d7ef225')
```


# JavaScript Reference

startAutoRefresh()



## Examples

### Start and stop auto refresh in React Native

```js
import { AppState } from 'react-native'

// make sure you register this only once!
AppState.addEventListener('change', (state) => {
  if (state === 'active') {
    supabase.auth.startAutoRefresh()
  } else {
    supabase.auth.stopAutoRefresh()
  }
})
```


# JavaScript Reference

stopAutoRefresh()



## Examples

### Start and stop auto refresh in React Native

```js
import { AppState } from 'react-native'

// make sure you register this only once!
AppState.addEventListener('change', (state) => {
  if (state === 'active') {
    supabase.auth.startAutoRefresh()
  } else {
    supabase.auth.stopAutoRefresh()
  }
})
```


# JavaScript Reference

Overview



## Examples



# JavaScript Reference

mfa.enroll()



## Examples

### Enroll a time-based, one-time password (TOTP) factor

```js
const { data, error } = await supabase.auth.mfa.enroll({
  factorType: 'totp',
  friendlyName: 'your_friendly_name'
})

// Use the id to create a challenge.
// The challenge can be verified by entering the code generated from the authenticator app.
// The code will be generated upon scanning the qr_code or entering the secret into the authenticator app.
const { id, type, totp: { qr_code, secret, uri }, friendly_name } = data
const challenge = await supabase.auth.mfa.challenge({ factorId: id });
```


### Enroll a Phone Factor

```js
const { data, error } = await supabase.auth.mfa.enroll({
  factorType: 'phone',
  friendlyName: 'your_friendly_name',
  phone: '+12345678',
})

// Use the id to create a challenge and send an SMS with a code to the user.
const { id, type, friendly_name, phone } = data

const challenge = await supabase.auth.mfa.challenge({ factorId: id });
```


# JavaScript Reference

mfa.challenge()



## Examples

### Create a challenge for a factor

```js
const { data, error } = await supabase.auth.mfa.challenge({
  factorId: '34e770dd-9ff9-416c-87fa-43b31d7ef225'
})
```


### Create a challenge for a phone factor

```js
const { data, error } = await supabase.auth.mfa.challenge({
  factorId: '34e770dd-9ff9-416c-87fa-43b31d7ef225',
})
```


### Create a challenge for a phone factor (WhatsApp)

```js
const { data, error } = await supabase.auth.mfa.challenge({
  factorId: '34e770dd-9ff9-416c-87fa-43b31d7ef225',
  channel: 'whatsapp',
})
```


# JavaScript Reference

mfa.verify()



## Examples

### Verify a challenge for a factor

```js
const { data, error } = await supabase.auth.mfa.verify({
  factorId: '34e770dd-9ff9-416c-87fa-43b31d7ef225',
  challengeId: '4034ae6f-a8ce-4fb5-8ee5-69a5863a7c15',
  code: '123456'
})
```


# JavaScript Reference

mfa.challengeAndVerify()



## Examples

### Create and verify a challenge for a factor

```js
const { data, error } = await supabase.auth.mfa.challengeAndVerify({
  factorId: '34e770dd-9ff9-416c-87fa-43b31d7ef225',
  code: '123456'
})
```


# JavaScript Reference

mfa.unenroll()



## Examples

### Unenroll a factor

```js
const { data, error } = await supabase.auth.mfa.unenroll({
  factorId: '34e770dd-9ff9-416c-87fa-43b31d7ef225',
})
```


# JavaScript Reference

mfa.getAuthenticatorAssuranceLevel()



## Examples

### Get the AAL details of a session

```js
const { data, error } = await supabase.auth.mfa.getAuthenticatorAssuranceLevel()
const { currentLevel, nextLevel, currentAuthenticationMethods } = data
```


# JavaScript Reference

Overview



## Examples

### Create server-side auth client

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

const supabase = createClient(supabase_url, service_role_key, {
  auth: {
    autoRefreshToken: false,
    persistSession: false
  }
})

// Access auth admin api
const adminAuthClient = supabase.auth.admin
```


# JavaScript Reference

getUserById()



## Examples

### Fetch the user object using the access_token jwt

```js
const { data, error } = await supabase.auth.admin.getUserById(1)
```


# JavaScript Reference

listUsers()



## Examples

### Get a page of users

```js
const { data: { users }, error } = await supabase.auth.admin.listUsers()
```


### Paginated list of users

```js
const { data: { users }, error } = await supabase.auth.admin.listUsers({
  page: 1,
  perPage: 1000
})
```


# JavaScript Reference

createUser()



## Examples

### With custom user metadata

```js
const { data, error } = await supabase.auth.admin.createUser({
  email: 'user@email.com',
  password: 'password',
  user_metadata: { name: 'Yoda' }
})
```


### Auto-confirm the user's email

```js
const { data, error } = await supabase.auth.admin.createUser({
  email: 'user@email.com',
  email_confirm: true
})
```


### Auto-confirm the user's phone number

```js
const { data, error } = await supabase.auth.admin.createUser({
  phone: '1234567890',
  phone_confirm: true
})
```


# JavaScript Reference

deleteUser()



## Examples

### Removes a user

```js
const { data, error } = await supabase.auth.admin.deleteUser(
  '715ed5db-f090-4b8c-a067-640ecee36aa0'
)
```


# JavaScript Reference

inviteUserByEmail()



## Examples

### Invite a user

```js
const { data, error } = await supabase.auth.admin.inviteUserByEmail('email@example.com')
```


# JavaScript Reference

generateLink()



## Examples

### Generate a signup link

```js
const { data, error } = await supabase.auth.admin.generateLink({
  type: 'signup',
  email: 'email@example.com',
  password: 'secret'
})
```


### Generate an invite link

```js
const { data, error } = await supabase.auth.admin.generateLink({
  type: 'invite',
  email: 'email@example.com'
})
```


### Generate a magic link

```js
const { data, error } = await supabase.auth.admin.generateLink({
  type: 'magiclink',
  email: 'email@example.com'
})
```


### Generate a recovery link

```js
const { data, error } = await supabase.auth.admin.generateLink({
  type: 'recovery',
  email: 'email@example.com'
})
```


### Generate links to change current email address

```js
// generate an email change link to be sent to the current email address
const { data, error } = await supabase.auth.admin.generateLink({
  type: 'email_change_current',
  email: 'current.email@example.com',
  newEmail: 'new.email@example.com'
})

// generate an email change link to be sent to the new email address
const { data, error } = await supabase.auth.admin.generateLink({
  type: 'email_change_new',
  email: 'current.email@example.com',
  newEmail: 'new.email@example.com'
})
```


# JavaScript Reference

updateUserById()



## Examples

### Updates a user's email

```js
const { data: user, error } = await supabase.auth.admin.updateUserById(
  '11111111-1111-1111-1111-111111111111',
  { email: 'new@email.com' }
)
```


### Updates a user's password

```js
const { data: user, error } = await supabase.auth.admin.updateUserById(
  '6aa5d0d4-2a9f-4483-b6c8-0cf4c6c98ac4',
  { password: 'new_password' }
)
```


### Updates a user's metadata

```js
const { data: user, error } = await supabase.auth.admin.updateUserById(
  '6aa5d0d4-2a9f-4483-b6c8-0cf4c6c98ac4',
  { user_metadata: { hello: 'world' } }
)
```


### Updates a user's app_metadata

```js
const { data: user, error } = await supabase.auth.admin.updateUserById(
  '6aa5d0d4-2a9f-4483-b6c8-0cf4c6c98ac4',
  { app_metadata: { plan: 'trial' } }
)
```


### Confirms a user's email address

```js
const { data: user, error } = await supabase.auth.admin.updateUserById(
  '6aa5d0d4-2a9f-4483-b6c8-0cf4c6c98ac4',
  { email_confirm: true }
)
```


### Confirms a user's phone number

```js
const { data: user, error } = await supabase.auth.admin.updateUserById(
  '6aa5d0d4-2a9f-4483-b6c8-0cf4c6c98ac4',
  { phone_confirm: true }
)
```


# JavaScript Reference

mfa.deleteFactor()



## Examples

### Delete a factor for a user

```js
const { data, error } = await supabase.auth.admin.mfa.deleteFactor({
  id: '34e770dd-9ff9-416c-87fa-43b31d7ef225',
  userId: 'a89baba7-b1b7-440f-b4bb-91026967f66b',
})
```


# JavaScript Reference

invoke()

Invoke a Supabase Edge Function.


## Examples

### Basic invocation

```js
const { data, error } = await supabase.functions.invoke('hello', {
  body: { foo: 'bar' }
})
```


### Error handling

```js
import { FunctionsHttpError, FunctionsRelayError, FunctionsFetchError } from "@supabase/supabase-js";

const { data, error } = await supabase.functions.invoke('hello', {
  headers: {
    "my-custom-header": 'my-custom-header-value'
  },
  body: { foo: 'bar' }
})

if (error instanceof FunctionsHttpError) {
  const errorMessage = await error.context.json()
  console.log('Function returned an error', errorMessage)
} else if (error instanceof FunctionsRelayError) {
  console.log('Relay error:', error.message)
} else if (error instanceof FunctionsFetchError) {
  console.log('Fetch error:', error.message)
}
```


### Passing custom headers

```js
const { data, error } = await supabase.functions.invoke('hello', {
  headers: {
    "my-custom-header": 'my-custom-header-value'
  },
  body: { foo: 'bar' }
})
```


### Calling with DELETE HTTP verb

```js
const { data, error } = await supabase.functions.invoke('hello', {
  headers: {
    "my-custom-header": 'my-custom-header-value'
  },
  body: { foo: 'bar' },
  method: 'DELETE'
})
```


### Invoking a Function in the UsEast1 region

```js
import { createClient, FunctionRegion } from '@supabase/supabase-js'

const { data, error } = await supabase.functions.invoke('hello', {
  body: { foo: 'bar' },
  region: FunctionRegion.UsEast1
})
```


### Calling with GET HTTP verb

```js
const { data, error } = await supabase.functions.invoke('hello', {
  headers: {
    "my-custom-header": 'my-custom-header-value'
  },
  method: 'GET'
})
```


# JavaScript Reference

on().subscribe()



## Examples

### Listen to broadcast messages

```js
const channel = supabase.channel("room1")

channel.on("broadcast", { event: "cursor-pos" }, (payload) => {
  console.log("Cursor position received!", payload);
}).subscribe((status) => {
  if (status === "SUBSCRIBED") {
    channel.send({
      type: "broadcast",
      event: "cursor-pos",
      payload: { x: Math.random(), y: Math.random() },
    });
  }
});
```


### Listen to presence sync

```js
const channel = supabase.channel('room1')
channel
  .on('presence', { event: 'sync' }, () => {
    console.log('Synced presence state: ', channel.presenceState())
  })
  .subscribe(async (status) => {
    if (status === 'SUBSCRIBED') {
      await channel.track({ online_at: new Date().toISOString() })
    }
  })
```


### Listen to presence join

```js
const channel = supabase.channel('room1')
channel
  .on('presence', { event: 'join' }, ({ newPresences }) => {
    console.log('Newly joined presences: ', newPresences)
  })
  .subscribe(async (status) => {
    if (status === 'SUBSCRIBED') {
      await channel.track({ online_at: new Date().toISOString() })
    }
  })
```


### Listen to presence leave

```js
const channel = supabase.channel('room1')
channel
  .on('presence', { event: 'leave' }, ({ leftPresences }) => {
    console.log('Newly left presences: ', leftPresences)
  })
  .subscribe(async (status) => {
    if (status === 'SUBSCRIBED') {
      await channel.track({ online_at: new Date().toISOString() })
      await channel.untrack()
    }
  })
```


### Listen to all database changes

```js
supabase
  .channel('room1')
  .on('postgres_changes', { event: '*', schema: '*' }, payload => {
    console.log('Change received!', payload)
  })
  .subscribe()
```


### Listen to a specific table

```js
supabase
  .channel('room1')
  .on('postgres_changes', { event: '*', schema: 'public', table: 'countries' }, payload => {
    console.log('Change received!', payload)
  })
  .subscribe()
```


### Listen to inserts

```js
supabase
  .channel('room1')
  .on('postgres_changes', { event: 'INSERT', schema: 'public', table: 'countries' }, payload => {
    console.log('Change received!', payload)
  })
  .subscribe()
```


### Listen to updates

```js
supabase
  .channel('room1')
  .on('postgres_changes', { event: 'UPDATE', schema: 'public', table: 'countries' }, payload => {
    console.log('Change received!', payload)
  })
  .subscribe()
```


### Listen to deletes

```js
supabase
  .channel('room1')
  .on('postgres_changes', { event: 'DELETE', schema: 'public', table: 'countries' }, payload => {
    console.log('Change received!', payload)
  })
  .subscribe()
```


### Listen to multiple events

```js
supabase
  .channel('room1')
  .on('postgres_changes', { event: 'INSERT', schema: 'public', table: 'countries' }, handleRecordInserted)
  .on('postgres_changes', { event: 'DELETE', schema: 'public', table: 'countries' }, handleRecordDeleted)
  .subscribe()
```


### Listen to row level changes

```js
supabase
  .channel('room1')
  .on('postgres_changes', { event: 'UPDATE', schema: 'public', table: 'countries', filter: 'id=eq.200' }, handleRecordUpdated)
  .subscribe()
```


# JavaScript Reference

removeChannel()



## Examples

### Removes a channel

```js
supabase.removeChannel(myChannel)
```


# JavaScript Reference

removeAllChannels()



## Examples

### Remove all channels

```js
supabase.removeAllChannels()
```


# JavaScript Reference

getChannels()



## Examples

### Get all channels

```js
const channels = supabase.getChannels()
```


# JavaScript Reference

broadcastMessage()

Broadcast a message to all connected clients to a channel.


## Examples

### Send a message via websocket

```js
supabase
  .channel('room1')
  .subscribe((status) => {
    if (status === 'SUBSCRIBED') {
      channel.send({
        type: 'broadcast',
        event: 'cursor-pos',
        payload: { x: Math.random(), y: Math.random() },
      })
    }
  })
```


### Send a message via REST

```js
supabase
  .channel('room1')
  .send({
    type: 'broadcast',
    event: 'cursor-pos',
    payload: { x: Math.random(), y: Math.random()
    },
  })
```


# JavaScript Reference

createBucket()



## Examples

### Create bucket

```js
const { data, error } = await supabase
  .storage
  .createBucket('avatars', {
    public: false,
    allowedMimeTypes: ['image/png'],
    fileSizeLimit: 1024
  })
```


# JavaScript Reference

getBucket()



## Examples

### Get bucket

```js
const { data, error } = await supabase
  .storage
  .getBucket('avatars')
```


# JavaScript Reference

listBuckets()



## Examples

### List buckets

```ts
const { data, error } = await supabase
  .storage
  .listBuckets()
```


# JavaScript Reference

updateBucket()



## Examples

### Update bucket

```js
const { data, error } = await supabase
  .storage
  .updateBucket('avatars', {
    public: false,
    allowedMimeTypes: ['image/png'],
    fileSizeLimit: 1024
  })
```


# JavaScript Reference

deleteBucket()



## Examples

### Delete bucket

```js
const { data, error } = await supabase
  .storage
  .deleteBucket('avatars')
```


# JavaScript Reference

emptyBucket()



## Examples

### Empty bucket

```js
const { data, error } = await supabase
  .storage
  .emptyBucket('avatars')
```


# JavaScript Reference

from.upload()



## Examples

### Upload file

```js
const avatarFile = event.target.files[0]
const { data, error } = await supabase
  .storage
  .from('avatars')
  .upload('public/avatar1.png', avatarFile, {
    cacheControl: '3600',
    upsert: false
  })
```


### Upload file using `ArrayBuffer` from base64 file data

```js
import { decode } from 'base64-arraybuffer'

const { data, error } = await supabase
  .storage
  .from('avatars')
  .upload('public/avatar1.png', decode('base64FileData'), {
    contentType: 'image/png'
  })
```


# JavaScript Reference

from.download()



## Examples

### Download file

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .download('folder/avatar1.png')
```


### Download file with transformations

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .download('folder/avatar1.png', {
    transform: {
      width: 100,
      height: 100,
      quality: 80
    }
  })
```


# JavaScript Reference

from.list()



## Examples

### List files in a bucket

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .list('folder', {
    limit: 100,
    offset: 0,
    sortBy: { column: 'name', order: 'asc' },
  })
```


### Search files in a bucket

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .list('folder', {
    limit: 100,
    offset: 0,
    sortBy: { column: 'name', order: 'asc' },
    search: 'jon'
  })
```


# JavaScript Reference

from.update()



## Examples

### Update file

```js
const avatarFile = event.target.files[0]
const { data, error } = await supabase
  .storage
  .from('avatars')
  .update('public/avatar1.png', avatarFile, {
    cacheControl: '3600',
    upsert: true
  })
```


### Update file using `ArrayBuffer` from base64 file data

```js
import {decode} from 'base64-arraybuffer'

const { data, error } = await supabase
  .storage
  .from('avatars')
  .update('public/avatar1.png', decode('base64FileData'), {
    contentType: 'image/png'
  })
```


# JavaScript Reference

from.move()



## Examples

### Move file

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .move('public/avatar1.png', 'private/avatar2.png')
```


# JavaScript Reference

from.copy()



## Examples

### Copy file

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .copy('public/avatar1.png', 'private/avatar2.png')
```


# JavaScript Reference

from.remove()



## Examples

### Delete file

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .remove(['folder/avatar1.png'])
```


# JavaScript Reference

from.createSignedUrl()



## Examples

### Create Signed URL

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .createSignedUrl('folder/avatar1.png', 60)
```


### Create a signed URL for an asset with transformations

```js
const { data } = await supabase
  .storage
  .from('avatars')
  .createSignedUrl('folder/avatar1.png', 60, {
    transform: {
      width: 100,
      height: 100,
    }
  })
```


### Create a signed URL which triggers the download of the asset

```js
const { data } = await supabase
  .storage
  .from('avatars')
  .createSignedUrl('folder/avatar1.png', 60, {
    download: true,
  })
```


# JavaScript Reference

from.createSignedUrls()



## Examples

### Create Signed URLs

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .createSignedUrls(['folder/avatar1.png', 'folder/avatar2.png'], 60)
```


# JavaScript Reference

from.createSignedUploadUrl()



## Examples

### Create Signed Upload URL

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .createSignedUploadUrl('folder/cat.jpg')
```


# JavaScript Reference

from.uploadToSignedUrl()



## Examples

### Upload to a signed URL

```js
const { data, error } = await supabase
  .storage
  .from('avatars')
  .uploadToSignedUrl('folder/cat.jpg', 'token-from-createSignedUploadUrl', file)
```


# JavaScript Reference

from.getPublicUrl()



## Examples

### Returns the URL for an asset in a public bucket

```js
const { data } = supabase
  .storage
  .from('public-bucket')
  .getPublicUrl('folder/avatar1.png')
```


### Returns the URL for an asset in a public bucket with transformations

```js
const { data } = supabase
  .storage
  .from('public-bucket')
  .getPublicUrl('folder/avatar1.png', {
    transform: {
      width: 100,
      height: 100,
    }
  })
```


### Returns the URL which triggers the download of an asset in a public bucket

```js
const { data } = supabase
  .storage
  .from('public-bucket')
  .getPublicUrl('folder/avatar1.png', {
    download: true,
  })
```