mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 09:25:06 +03:00
Auth docs updates (#3733)
* Adds an outline for the new providers * Adds `generateLink()` docs * Updates the tagline for Auth * added slack auth provider setup steps * added spotify auth provider setup steps * fix: add messagebird docs * docs: remove video * docs: update generateLink() description * Adds a few more server routes * finalises the naming on some of the auth sidebar items * add a redirect for deleteUser() Co-authored-by: Mark Burggraf <markb@mantisbible.com> Co-authored-by: Kang Ming <kang.ming1996@gmail.com>
This commit is contained in:
16 files changed
+633
-17
No files matched your search
@@ -39,7 +39,7 @@ We currently support the following OAuth providers:
|
||||
<div class="container" style={{}}>
|
||||
<div class="row is-multiline">
|
||||
{providers.map((x) => (
|
||||
<div key={x.name} class="col col--3">
|
||||
<div key={x.name} class="col col--4">
|
||||
<Link class="card" to={x.href}>
|
||||
<div class="card__body" style={{ display: 'flex', gap: 20 }}>
|
||||
{x.logo && <img src={x.logo} alt={x.name} width="20" />}
|
||||
|
||||
@@ -0,0 +1,283 @@
|
||||
---
|
||||
id: auth-messagebird
|
||||
title: Phone Auth with MessageBird
|
||||
description: How to set up and use Mobile OTP with MessageBird and Supabase.
|
||||
---
|
||||
|
||||
import ExtensionsComponent from '../../../../web/src/components/Extensions'
|
||||
import Tabs from '@theme/Tabs'
|
||||
import TabItem from '@theme/TabItem'
|
||||
|
||||
## Overview
|
||||
|
||||
In this guide we'll show you how to authenticate your users with SMS based OTP (One-Time Password) tokens.
|
||||
|
||||
There are two reasons to use Supabase SMS OTP tokens:
|
||||
|
||||
- You want users to log in with mobile + password, and the mobile should be verified via SMS
|
||||
- You want users to log in with mobile ONLY (i.e. passwordless login)
|
||||
|
||||
We'll cover:
|
||||
|
||||
- [Finding your MessageBird credentials](#finding-your-messagebird-credentials)
|
||||
- [Using OTP with password based logins](#using-otp-with-password-based-logins)
|
||||
- [Using OTP as a passwordless sign-in mechanism](#using-otp-as-a-passwordless-sign-in-mechanism)
|
||||
|
||||
What you'll need:
|
||||
|
||||
- A MessageBird account (sign up here: https://dashboard.messagebird.com/en/sign-up)
|
||||
- A Supabase project (create one here: https://app.supabase.io)
|
||||
- A mobile phone capable of receiving SMS
|
||||
|
||||
## Steps
|
||||
|
||||
### Finding your MessageBird credentials
|
||||
|
||||
Start by logging into your MessageBird account and verify the mobile number you'll be using to test with: https://dashboard.messagebird.com/en/getting-started/sms
|
||||
|
||||
This is the number that will be receiving the SMS OTPs.
|
||||
|
||||

|
||||
|
||||

|
||||
|
||||
Navigate to the [dashboard settings](https://dashboard.messagebird.com/en/settings/sms) to set the default originator. The messagebird originator is the name or number from which the message is sent.
|
||||
For more information, you can refer to the messagebird article on choosing an originator [here](https://support.messagebird.com/hc/en-us/articles/115002628665-Choosing-an-originator)
|
||||
|
||||

|
||||
|
||||
You will need the following values to get started:
|
||||
|
||||
- Live API Key / Test API Key
|
||||
- MessageBird originator
|
||||
|
||||
Now go to the Auth > Settings page in the Supabase dashboard (https://app.supabase.io/project/YOUR-PROJECT-REF/auth/settings).
|
||||
|
||||
You should see an option to enable Phone Signup.
|
||||
|
||||

|
||||
|
||||
Toggle it on, and copy the 2 values over from the messagebird dashboard. Click save.
|
||||
|
||||
Note: If you use the Test API Key, the OTP will not be delivered to the mobile number specified but messagebird will log the response in the dashboard.
|
||||
If the Live API Key is used instead, the OTP will be delivered and there will be a deduction in your free credits.
|
||||
|
||||
<!-- TODO: Add screenshot of UI -->
|
||||
Plug in MessageBird credentials
|
||||
|
||||
Now the backend should be setup, we can proceed to adding our client-side code!
|
||||
|
||||
#### SMS custom template
|
||||
|
||||
The SMS message sent to a phone containing an OTP code can be customized. This is useful if you need to mention a brand name or display a website address.
|
||||
|
||||
Go to Auth > Templates page in the Supabase dashboard (https://app.supabase.io/project/YOUR-PROJECT-REF/auth/templates).
|
||||
|
||||
Use the variable `.Code` in the template to display the code.
|
||||
|
||||
### Using OTP with password based logins
|
||||
|
||||
In this use scenario we'll be using the user's mobile phone number as an alternative to an email address when signing up along with a password. You may want to think hard about the permanency of this however. It is not uncommon for mobile phone numbers to be recycled by phone networks when users cancel their phone contracts or move countries, therefore granting access to the user's account to whomever takes over the phone number in the future. Soon we'll add multi-factor auth, which will mitigate this risk, but for now you may want to give some thought to allowing your users to recover their account by some other means in an emergency.
|
||||
|
||||
Using supabase-js on the client you'll want to use the same `signUp` method that you'd use for email based sign ups, but with the `phone` param instead of the `email param`:
|
||||
|
||||
<Tabs
|
||||
defaultValue="JS"
|
||||
values={[
|
||||
{label: 'Javascript', value: 'JS'},
|
||||
{label: 'HTTP', value: 'HTTP'},
|
||||
]}>
|
||||
<TabItem value="JS">
|
||||
|
||||
```js
|
||||
let { user, error } = await supabase.auth.signUp({
|
||||
phone: '+13334445555',
|
||||
password: 'some-password',
|
||||
})
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="HTTP">
|
||||
|
||||
```bash
|
||||
curl -X POST 'https://cvwawazfelidkloqmbma.supabase.co/auth/v1/signup' \
|
||||
-H "apikey: SUPABASE_KEY" \
|
||||
-H "Content-Type: application/json" \
|
||||
-d '{
|
||||
"phone": "+13334445555",
|
||||
"password": "some-password"
|
||||
}'
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
The user will now receive an SMS with a 6-digit pin that you will need to receive from them within 60-seconds before they can login to their account.
|
||||
|
||||
You should present a form to the user so they can input the 6 digit pin, then send it along with the phone number to `verifyOTP`:
|
||||
|
||||
<Tabs
|
||||
defaultValue="JS"
|
||||
values={[
|
||||
{label: 'Javascript', value: 'JS'},
|
||||
{label: 'HTTP', value: 'HTTP'},
|
||||
]}>
|
||||
<TabItem value="JS">
|
||||
|
||||
```js
|
||||
let { session, error } = await supabase.auth.verifyOTP({
|
||||
phone: '+13334445555',
|
||||
token: '123456',
|
||||
})
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="HTTP">
|
||||
|
||||
```bash
|
||||
curl -X POST 'https://cvwawazfelidkloqmbma.supabase.co/auth/v1/verify' \
|
||||
-H "apikey: SUPABASE_KEY" \
|
||||
-H "Content-Type: application/json" \
|
||||
-d '{
|
||||
"type": "sms",
|
||||
"phone": "+13334445555",
|
||||
"token": "123456"
|
||||
}'
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
If successful the user will now be logged in and you should receive a valid session like:
|
||||
|
||||
```json
|
||||
{
|
||||
"access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJhdXRoZW50aWNhdGVkIiwiZXhwIjoxNjI3MjkxNTc3LCJzdWIiOiJmYTA2NTQ1Zi1kYmI1LTQxY2EtYjk1NC1kOGUyOTg4YzcxOTEiLCJlbWFpbCI6IiIsInBob25lIjoiNjU4NzUyMjAyOSIsImFwcF9tZXRhZGF0YSI6eyJwcm92aWRlciI6InBob25lIn0sInVzZXJfbWV0YWRhdGEiOnt9LCJyb2xlIjoiYXV0aGVudGljYXRlZCJ9.1BqRi0NbS_yr1f6hnr4q3s1ylMR3c1vkiJ4e_N55dhM",
|
||||
"token_type": "bearer",
|
||||
"expires_in": 3600,
|
||||
"refresh_token": "LSp8LglPPvf0DxGMSj-vaQ"
|
||||
}
|
||||
```
|
||||
|
||||
The access token can be sent in the Authorization header as a Bearer token for any CRUD operations on supabase-js. See our guide on [Row Level Security](https://supabase.io/docs/guides/auth#row-level-security) for more info on restricting access on a user basis.
|
||||
|
||||
Also now that the mobile has been verified, the user can use the number and password to sign in without needing to verify their number each time:
|
||||
|
||||
<Tabs
|
||||
defaultValue="JS"
|
||||
values={[
|
||||
{label: 'Javascript', value: 'JS'},
|
||||
{label: 'HTTP', value: 'HTTP'},
|
||||
]}>
|
||||
<TabItem value="JS">
|
||||
|
||||
```js
|
||||
let { user, error } = await supabase.auth.signIn({
|
||||
phone: '+13334445555',
|
||||
password: 'some-password',
|
||||
})
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="HTTP">
|
||||
|
||||
```bash
|
||||
curl -X POST 'https://cvwawazfelidkloqmbma.supabase.co/auth/v1/token?grant_type=password' \
|
||||
-H "apikey: SUPABASE_KEY" \
|
||||
-H "Content-Type: application/json" \
|
||||
-d '{
|
||||
"phone": "+13334445555",
|
||||
"password": "some-password"
|
||||
}'
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
### Using OTP as a passwordless sign-in mechanism
|
||||
|
||||
In this scenario you are granting your user's the ability to login to their account without needing to set a password on their account, all they have to do to log in is verify their mobile each time using the OTP.
|
||||
|
||||
In javascript we can use the `signIn` method with a single parameter: `phone`
|
||||
|
||||
<Tabs
|
||||
defaultValue="JS"
|
||||
values={[
|
||||
{label: 'Javascript', value: 'JS'},
|
||||
{label: 'HTTP', value: 'HTTP'},
|
||||
]}>
|
||||
<TabItem value="JS">
|
||||
|
||||
```js
|
||||
let { user, error } = await supabase.auth.signIn({
|
||||
phone: '+13334445555',
|
||||
})
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="HTTP">
|
||||
|
||||
```bash
|
||||
curl -X POST 'https://cvwawazfelidkloqmbma.supabase.co/auth/v1/otp' \
|
||||
-H "apikey: SUPABASE_KEY" \
|
||||
-H "Content-Type: application/json" \
|
||||
-d '{
|
||||
"phone": "+13334445555"
|
||||
}'
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
the second step is the same as the previous section, you need to collect the 6-digit pin from the user and pass it along with their phone number to the verify method:
|
||||
|
||||
<Tabs
|
||||
defaultValue="JS"
|
||||
values={[
|
||||
{label: 'Javascript', value: 'JS'},
|
||||
{label: 'HTTP', value: 'HTTP'},
|
||||
]}>
|
||||
<TabItem value="JS">
|
||||
|
||||
```js
|
||||
let { session, error } = await supabase.auth.verifyOTP({
|
||||
phone: '+13334445555',
|
||||
token: '123456',
|
||||
})
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="HTTP">
|
||||
|
||||
```bash
|
||||
curl -X POST 'https://cvwawazfelidkloqmbma.supabase.co/auth/v1/verify' \
|
||||
-H "apikey: SUPABASE_KEY" \
|
||||
-H "Content-Type: application/json" \
|
||||
-d '{
|
||||
"type": "sms",
|
||||
"phone": "+13334445555",
|
||||
"token": "123456"
|
||||
}'
|
||||
```
|
||||
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
and the response should also be the same as above:
|
||||
|
||||
```json
|
||||
{
|
||||
"access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJhdXRoZW50aWNhdGVkIiwiZXhwIjoxNjI3MjkxNTc3LCJzdWIiOiJmYTA2NTQ1Zi1kYmI1LTQxY2EtYjk1NC1kOGUyOTg4YzcxOTEiLCJlbWFpbCI6IiIsInBob25lIjoiNjU4NzUyMjAyOSIsImFwcF9tZXRhZGF0YSI6eyJwcm92aWRlciI6InBob25lIn0sInVzZXJfbWV0YWRhdGEiOnt9LCJyb2xlIjoiYXV0aGVudGljYXRlZCJ9.1BqRi0NbS_yr1f6hnr4q3s1ylMR3c1vkiJ4e_N55dhM",
|
||||
"token_type": "bearer",
|
||||
"expires_in": 3600,
|
||||
"refresh_token": "LSp8LglPPvf0DxGMSj-vaQ"
|
||||
}
|
||||
```
|
||||
|
||||
The user does not have a password therefore will need to sign in via this method each time they want to access your service.
|
||||
|
||||
## Resources
|
||||
|
||||
- [MessageBird Signup](https://dashboard.messagebird.com/en/sign-up)
|
||||
- [Supabase Dashboard](https://app.supabase.io)
|
||||
- [Supabase Row Level Security](https://supabase.io/docs/guides/auth#row-level-security)
|
||||
@@ -0,0 +1,111 @@
|
||||
---
|
||||
id: auth-slack
|
||||
title: "Login with Slack"
|
||||
description: Add Slack OAuth to your Supabase project
|
||||
---
|
||||
|
||||
import Tabs from '@theme/Tabs';
|
||||
import TabItem from '@theme/TabItem';
|
||||
|
||||
To enable Slack Auth for your project, you need to set up a Slack OAuth application and add the application credentials to your Supabase Dashboard.
|
||||
|
||||
## Overview
|
||||
|
||||
Setting up Slack logins for your application consists of 3 parts:
|
||||
|
||||
* Create and configure a Slack Project and App on the [Slack Developer Dashboard](https://api.slack.com/apps).
|
||||
* Add your Slack `API Key` and `API Secret Key` to your [Supabase Project](https://supabase.io).
|
||||
* Add the login code to your [Supabase JS Client App](https://github.com/supabase/supabase-js).
|
||||
|
||||
## Steps
|
||||
|
||||
### Access your Slack Developer account
|
||||
|
||||
- Go to [api.slack.com](https://api.slack.com/apps).
|
||||
- Click on `Your Apps` at the top right to log in.
|
||||
|
||||

|
||||
|
||||
### Find your callback URL
|
||||
|
||||
The next step requires a callback URL, which looks like this:
|
||||
|
||||
`https://<project-ref>.supabase.co/auth/v1/callback`
|
||||
|
||||
- Go to your [Supabase Project Dashboard](https://supabase.io).
|
||||
- Click on the `Settings` icon at the bottom of the left sidebar.
|
||||
- Click on `API` in the list.
|
||||
- Under Config / URL you'll find your API URL, you can click `Copy` to copy it to the clipboard.
|
||||
- Now just add `/auth/v1/callback` to the end of that to get your full `OAuth Redirect URI`.
|
||||
|
||||
<video width="99%" muted playsInline controls="true">
|
||||
<source src="/videos/api/api-url-and-key.mp4" type="video/mp4" muted playsInline />
|
||||
</video>
|
||||
|
||||
### Create a Slack OAuth app
|
||||
|
||||
- Go to [api.slack.com](https://api.slack.com/apps).
|
||||
- Click on `Create an App`
|
||||
|
||||
Under `Create an app...`:
|
||||
|
||||
- Click `From scratch`
|
||||
- Type the name of your app
|
||||
- Select your `Slack Workspace`
|
||||
- Click `Create App`
|
||||
|
||||
Under `App Credentials`:
|
||||
|
||||
- Copy and save your newly-generted `Client ID`
|
||||
- Copy and save your newly-generate `Client Secret`
|
||||
- Click `Permissions`
|
||||
|
||||
Under `Redirect URLs`:
|
||||
|
||||
- Click `Add New Redirect URL`
|
||||
- Paste your `Callback URL` then click `Add`
|
||||
- Click `Save URLs`
|
||||
|
||||
### Enter your Slack credentials into your Supabase Project
|
||||
|
||||
- Go to your [Supabase Project Dashboard](https://supabase.io).
|
||||
- In the left sidebar, click the `Authentication` icon (near the top).
|
||||
- Click `Settings` from the list to go to the `Authentication Settings` page.
|
||||
- Enter the final (hosted) URL of your app under `Site URL` (this is important).
|
||||
- Under `External OAuth Providers` turn `Slack Enabled` to ON.
|
||||
- Enter your `API Key` (`client_id`) and `API Secret Key` (`client_secret`) saved in the previous step.
|
||||
- Click `Save`.
|
||||
|
||||
### Add login code to your client app
|
||||
|
||||
The JavaScript client code is documented here: [Supabase OAuth Client Code](https://supabase.io/docs/reference/javascript/auth-signin#sign-in-using-third-party-providers).
|
||||
|
||||
```js
|
||||
const { user, session, error } = await supabase.auth.signIn({
|
||||
provider: 'slack'
|
||||
})
|
||||
```
|
||||
|
||||
Add this function which you can call from a button, link, or UI element.
|
||||
|
||||
```js
|
||||
async function signInWithSlack() {
|
||||
const { user, session, error } = await supabase.auth.signIn({
|
||||
provider: 'slack'
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
To log out:
|
||||
|
||||
```js
|
||||
async function signout() {
|
||||
const { error } = await supabase.auth.signOut();
|
||||
}
|
||||
```
|
||||
|
||||
## Resources
|
||||
|
||||
* [Supabase Account - Free Tier OK](https://supabase.io)
|
||||
* [Supabase JS Client](https://github.com/supabase/supabase-js)
|
||||
* [Slack Developer Dashboard](https://api.slack.com/apps)
|
||||
@@ -0,0 +1,106 @@
|
||||
---
|
||||
id: auth-spotify
|
||||
title: "Login with Spotify"
|
||||
description: Add Spotify OAuth to your Supabase project
|
||||
---
|
||||
|
||||
import Tabs from '@theme/Tabs';
|
||||
import TabItem from '@theme/TabItem';
|
||||
|
||||
To enable Spotify Auth for your project, you need to set up a Spotify OAuth application and add the application credentials to your Supabase Dashboard.
|
||||
|
||||
## Overview
|
||||
|
||||
Setting up Spotify logins for your application consists of 3 parts:
|
||||
|
||||
* Create and configure a Spotify Project and App on the [Spotify Developer Dashboard](https://developer.spotify.com/dashboard/).
|
||||
* Add your Spotify `API Key` and `API Secret Key` to your [Supabase Project](https://supabase.io).
|
||||
* Add the login code to your [Supabase JS Client App](https://github.com/supabase/supabase-js).
|
||||
|
||||
## Steps
|
||||
|
||||
### Access your Spotify Developer account
|
||||
|
||||
- Log into [Spotify](https://spotify.com)
|
||||
- Access the [Spotify Developer Dashboard](https://developer.spotify.com/dashboard)
|
||||
|
||||

|
||||
|
||||
### Find your callback URL
|
||||
|
||||
The next step requires a callback URL, which looks like this:
|
||||
|
||||
`https://<project-ref>.supabase.co/auth/v1/callback`
|
||||
|
||||
- Go to your [Supabase Project Dashboard](https://supabase.io).
|
||||
- Click on the `Settings` icon at the bottom of the left sidebar.
|
||||
- Click on `API` in the list.
|
||||
- Under Config / URL you'll find your API URL, you can click `Copy` to copy it to the clipboard.
|
||||
- Now just add `/auth/v1/callback` to the end of that to get your full `OAuth Redirect URI`.
|
||||
|
||||
<video width="99%" muted playsInline controls="true">
|
||||
<source src="/videos/api/api-url-and-key.mp4" type="video/mp4" muted playsInline />
|
||||
</video>
|
||||
|
||||
### Create a Spotify OAuth app
|
||||
|
||||
- Log into [Spotify](https://spotify.com).
|
||||
- Go to the [Spotify Developer Dashboard](https://developer.spotify.com/dashboard)
|
||||
- Click `Create an App`
|
||||
- Type your `App name`
|
||||
- Type your `App description`
|
||||
- Check the box to agree with the `Developer TOS and Branding Guidelines`
|
||||
- Click `Create`
|
||||
- Save your `Client ID`
|
||||
- Save your `Client Secret`
|
||||
- Click `Edit Settings`
|
||||
|
||||
Under `Redirect URIs`:
|
||||
|
||||
- Paste your Supabase Callback URL in the box
|
||||
- Click `Add`
|
||||
- Click `Save` at the bottom
|
||||
|
||||
### Enter your Spotify credentials into your Supabase Project
|
||||
|
||||
- Go to your [Supabase Project Dashboard](https://supabase.io).
|
||||
- In the left sidebar, click the `Authentication` icon (near the top).
|
||||
- Click `Settings` from the list to go to the `Authentication Settings` page.
|
||||
- Enter the final (hosted) URL of your app under `Site URL` (this is important).
|
||||
- Under `External OAuth Providers` turn `Spotify Enabled` to ON.
|
||||
- Enter your `API Key` (`client_id`) and `API Secret Key` (`client_secret`) saved in the previous step.
|
||||
- Click `Save`.
|
||||
|
||||
### Add login code to your client app
|
||||
|
||||
The JavaScript client code is documented here: [Supabase OAuth Client Code](https://supabase.io/docs/reference/javascript/auth-signin#sign-in-using-third-party-providers).
|
||||
|
||||
```js
|
||||
const { user, session, error } = await supabase.auth.signIn({
|
||||
provider: 'spotify'
|
||||
})
|
||||
```
|
||||
|
||||
Add this function which you can call from a button, link, or UI element.
|
||||
|
||||
```js
|
||||
async function signInWithSpotify() {
|
||||
const { user, session, error } = await supabase.auth.signIn({
|
||||
provider: 'spotify'
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
To log out:
|
||||
|
||||
```js
|
||||
async function signout() {
|
||||
const { error } = await supabase.auth.signOut();
|
||||
}
|
||||
```
|
||||
|
||||
## Resources
|
||||
|
||||
* [Supabase Account - Free Tier OK](https://supabase.io)
|
||||
* [Supabase JS Client](https://github.com/supabase/supabase-js)
|
||||
* [Spotify Developer Dashboard](https://developer.spotify.com/dashboard/)
|
||||
@@ -40,7 +40,7 @@ You can authenticate your users in several ways:
|
||||
<div class="container" style={{ padding: 0 }}>
|
||||
<div class="row is-multiline">
|
||||
{providers.map((x) => (
|
||||
<div key={x.name} class="col col--4">
|
||||
<div key={x.name} class="col col--6">
|
||||
<Link class="card" to={x.href}>
|
||||
<div class="card__body">
|
||||
<div class="" style={{ display: 'flex', justifyContent: 'space-between', gap: 10 }}>
|
||||
@@ -62,7 +62,7 @@ You can authenticate your users in several ways:
|
||||
<span>{x.platform.toString()}</span>
|
||||
</div>
|
||||
<div class="code-block" style={{ width: '100%', display: 'flex', justifyContent: 'space-between', fontSize: '0.7rem' }}>
|
||||
<span>Hosted:</span>
|
||||
<span>Self-Hosted:</span>
|
||||
<span>{x.selfHosted.toString()}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -9,7 +9,13 @@ module.exports = {
|
||||
{
|
||||
type: 'category',
|
||||
label: 'Auth',
|
||||
items: ['reference/javascript/auth-signup', 'reference/javascript/auth-signin', 'reference/javascript/auth-signout', 'reference/javascript/auth-session', 'reference/javascript/auth-user', 'reference/javascript/auth-update', 'reference/javascript/auth-setauth', 'reference/javascript/auth-onauthstatechange', 'reference/javascript/reset-password-email', 'reference/javascript/delete-user'],
|
||||
items: ['reference/javascript/auth-signup', 'reference/javascript/auth-signin', 'reference/javascript/auth-signout', 'reference/javascript/auth-session', 'reference/javascript/auth-user', 'reference/javascript/auth-update', 'reference/javascript/auth-setauth', 'reference/javascript/auth-onauthstatechange', 'reference/javascript/reset-password-email'],
|
||||
collapsed: true,
|
||||
},
|
||||
{
|
||||
type: 'category',
|
||||
label: 'Auth (Server Only)',
|
||||
items: ['reference/javascript/auth-api-deleteuser', 'reference/javascript/auth-api-generatelink', 'reference/javascript/auth-api-inviteuserbyemail', 'reference/javascript/auth-api-sendmobileotp', 'reference/javascript/auth-api-resetpasswordforemail'],
|
||||
collapsed: true,
|
||||
},
|
||||
{
|
||||
|
||||
@@ -152,9 +152,12 @@ module.exports = {
|
||||
'guides/auth/auth-github',
|
||||
'guides/auth/auth-gitlab',
|
||||
'guides/auth/auth-google',
|
||||
'guides/auth/auth-slack',
|
||||
'guides/auth/auth-spotify',
|
||||
'guides/auth/auth-twitter',
|
||||
'guides/auth/auth-twitch',
|
||||
'guides/auth/auth-twilio',
|
||||
'guides/auth/auth-messagebird',
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
+87
-3
@@ -40,7 +40,13 @@ info:
|
||||
- auth.setAuth()
|
||||
- auth.onAuthStateChange()
|
||||
- Reset Password (Email)
|
||||
- Delete User
|
||||
- name: 'Auth (Server Only)'
|
||||
items:
|
||||
- auth.api.deleteUser()
|
||||
- auth.api.generateLink()
|
||||
- auth.api.inviteUserByEmail()
|
||||
- auth.api.sendMobileOTP()
|
||||
- auth.api.resetPasswordForEmail()
|
||||
- name: 'Database'
|
||||
items:
|
||||
- select()
|
||||
@@ -309,6 +315,7 @@ pages:
|
||||
```
|
||||
|
||||
auth.signUp():
|
||||
title: 'signUp()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueClient".GoTrueClient.signUp'
|
||||
notes: |
|
||||
- By default, the user will need to verify their email address before logging in. If you would like to change this, you can disable "Email Confirmations" by going to Authentication -> Settings on [app.supabase.io](https://app.supabase.io)
|
||||
@@ -348,6 +355,7 @@ pages:
|
||||
You can sign up with OAuth providers using the [`signIn()`](/docs/reference/javascript/auth-signin#sign-in-using-third-party-providers) method.
|
||||
|
||||
auth.signIn():
|
||||
title: 'signIn()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueClient".GoTrueClient.signIn'
|
||||
notes: |
|
||||
- A user can sign up either via email or OAuth.
|
||||
@@ -427,6 +435,7 @@ pages:
|
||||
```
|
||||
|
||||
auth.signOut():
|
||||
title: 'signOut()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueClient".GoTrueClient.signOut'
|
||||
examples:
|
||||
- name: Sign out
|
||||
@@ -437,6 +446,7 @@ pages:
|
||||
```
|
||||
|
||||
auth.session():
|
||||
title: 'session()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueClient".GoTrueClient.session'
|
||||
examples:
|
||||
- name: Get the session data
|
||||
@@ -447,6 +457,7 @@ pages:
|
||||
```
|
||||
|
||||
auth.user():
|
||||
title: 'user()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueClient".GoTrueClient.user'
|
||||
examples:
|
||||
- name: Get the logged in user
|
||||
@@ -457,6 +468,7 @@ pages:
|
||||
```
|
||||
|
||||
auth.update():
|
||||
title: 'update()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueClient".GoTrueClient.update'
|
||||
notes: |
|
||||
User email: email updates will send an email to both the user's current and new email with a confirmation link.
|
||||
@@ -487,6 +499,7 @@ pages:
|
||||
```
|
||||
|
||||
auth.setAuth():
|
||||
title: 'setAuth()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueClient".GoTrueClient.setAuth'
|
||||
examples:
|
||||
- name: Basic example.
|
||||
@@ -545,6 +558,7 @@ pages:
|
||||
```
|
||||
|
||||
auth.onAuthStateChange():
|
||||
title: 'onAuthStateChange()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueClient".GoTrueClient.onAuthStateChange'
|
||||
examples:
|
||||
- name: Listen to auth changes
|
||||
@@ -578,11 +592,16 @@ pages:
|
||||
isSpotlight: true
|
||||
js: |
|
||||
```js
|
||||
const { data, error } = supabase.auth.api.resetPasswordForEmail('user@email.com')
|
||||
const { data, error } = supabase.auth.api
|
||||
.resetPasswordForEmail('user@email.com')
|
||||
```
|
||||
|
||||
Delete User:
|
||||
auth.api.deleteUser():
|
||||
title: 'deleteUser()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueApi".GoTrueApi.deleteUser'
|
||||
notes: |
|
||||
- Requires a `service_role` key.
|
||||
- This function should only be called on a server. Never expose your `service_role` key in the browser.
|
||||
examples:
|
||||
- name: Remove a user completely.
|
||||
isSpotlight: true
|
||||
@@ -594,6 +613,71 @@ pages:
|
||||
)
|
||||
```
|
||||
|
||||
auth.api.inviteUserByEmail():
|
||||
title: 'inviteUserByEmail()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueApi".GoTrueApi.inviteUserByEmail'
|
||||
notes: |
|
||||
- Requires a `service_role` key.
|
||||
- This function should only be called on a server. Never expose your `service_role` key in the browser.
|
||||
examples:
|
||||
- name: Basic example.
|
||||
isSpotlight: false
|
||||
js: |
|
||||
```js
|
||||
const { user, error } = await supabase.auth
|
||||
.api
|
||||
.inviteUserByEmail('email@example.com')
|
||||
```
|
||||
|
||||
auth.api.sendMobileOTP():
|
||||
title: 'sendMobileOTP()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueApi".GoTrueApi.sendMobileOTP'
|
||||
notes: |
|
||||
- Requires a `service_role` key.
|
||||
- This function should only be called on a server. Never expose your `service_role` key in the browser.
|
||||
examples:
|
||||
- name: Basic example.
|
||||
isSpotlight: false
|
||||
js: |
|
||||
```js
|
||||
const { user, error } = await supabase.auth
|
||||
.api
|
||||
.sendMobileOTP('12345879')
|
||||
```
|
||||
|
||||
auth.api.resetPasswordForEmail():
|
||||
title: 'resetPasswordForEmail()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueApi".GoTrueApi.resetPasswordForEmail'
|
||||
notes: |
|
||||
- Requires a `service_role` key.
|
||||
- This function should only be called on a server. Never expose your `service_role` key in the browser.
|
||||
examples:
|
||||
- name: Basic example.
|
||||
isSpotlight: false
|
||||
js: |
|
||||
```js
|
||||
const { user, error } = await supabase.auth
|
||||
.api
|
||||
.resetPasswordForEmail('email@example.com')
|
||||
```
|
||||
|
||||
auth.api.generateLink():
|
||||
title: 'generateLink()'
|
||||
$ref: '@supabase/gotrue-js."GoTrueApi".GoTrueApi.generateLink'
|
||||
notes: |
|
||||
- Requires a `service_role` key.
|
||||
- This function should only be called on a server. Never expose your `service_role` key in the browser.
|
||||
examples:
|
||||
- name: Generate invite link.
|
||||
isSpotlight: false
|
||||
js: |
|
||||
```js
|
||||
const { user, error } = await supabase.auth.api.generateLink({
|
||||
type: 'invite',
|
||||
email: 'email@example.com'
|
||||
})
|
||||
```
|
||||
|
||||
select():
|
||||
title: 'Fetch data: select()'
|
||||
$ref: '@supabase/postgrest-js."lib/PostgrestQueryBuilder".PostgrestQueryBuilder.select'
|
||||
|
||||
@@ -89,15 +89,33 @@ const authProviders = [
|
||||
platform: true,
|
||||
selfHosted: true,
|
||||
},
|
||||
// {
|
||||
// name: 'MessageBird',
|
||||
// // logo: '/img/libraries/dart-icon.svg',
|
||||
// href: '/docs/guides/auth/auth-twilio',
|
||||
// official: false,
|
||||
// supporter: 'Messagebird',
|
||||
// platform: false,
|
||||
// selfHosted: true,
|
||||
// },
|
||||
{
|
||||
name: 'MessageBird',
|
||||
// logo: '/img/libraries/dart-icon.svg',
|
||||
href: '/docs/guides/auth/auth-messagebird',
|
||||
official: false,
|
||||
supporter: 'MessageBird',
|
||||
platform: true,
|
||||
selfHosted: true,
|
||||
},
|
||||
{
|
||||
name: 'Slack',
|
||||
// logo: '/img/libraries/dart-icon.svg',
|
||||
href: '/docs/guides/auth/auth-slack',
|
||||
official: true,
|
||||
supporter: 'Supabase',
|
||||
platform: true,
|
||||
selfHosted: true,
|
||||
},
|
||||
{
|
||||
name: 'Spotify',
|
||||
// logo: '/img/libraries/dart-icon.svg',
|
||||
href: '/docs/guides/auth/auth-spotify',
|
||||
official: true,
|
||||
supporter: 'Supabase',
|
||||
platform: true,
|
||||
selfHosted: true,
|
||||
},
|
||||
{
|
||||
name: 'Twitter',
|
||||
// logo: '/img/libraries/dart-icon.svg',
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 146 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 84 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 186 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 780 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.8 MiB |
@@ -585,6 +585,11 @@ module.exports = withMDX({
|
||||
source: '/docs/guides/self-hosting',
|
||||
destination: '/docs/guides/hosting/overview',
|
||||
},
|
||||
{
|
||||
permanent: true,
|
||||
source: '/docs/reference/javascript/delete-user',
|
||||
destination: '/docs/reference/javascript/auth-api-deleteuser',
|
||||
},
|
||||
]
|
||||
},
|
||||
})
|
||||
@@ -66,7 +66,7 @@ function AuthPage() {
|
||||
h1={[
|
||||
<span key={'authentication-h1'}>
|
||||
Open Source Auth
|
||||
<br /> (without the integrations)
|
||||
<br /> (with tons of integrations)
|
||||
</span>,
|
||||
]}
|
||||
subheader={[
|
||||
|
||||
Reference in new issue
Block a user