Skip to main content

Seamless Supabase authentication for seamless Streamlit apps

Project description

streamlit_supabase_auth_ui

Seamless Supabase authentication for seamless Streamlit apps


GitHub top language GitHub commit activity Static Badge Static Badge

Supabase Logo plus Streamlit Logo

Purpose and Inspiration

Streamlit is a popular backend-to-frontend app development framework for python, and over the years several solutions have been developed to tackle user authentication and management for Streamlit apps.

The most popular of them, streamlit-authenticator and streamlit_login_auth_ui, although offering several advanced functionalities and dynamic UIs, lack a reliable backend, database-centered user management (which is generally performed through local files).

We decided to build a new authentication UI, based on Gauri Prabhakar's login interface, that combines the power of Supabase PostgreSQL databases with the seamless frontend components from Streamlit, connecting it also to the e-mail notifications service offered by Courier .

The UI has login, user registration, password reset and 'forgot password' functionalities, as well as a logout one.

So, let's get started!🚀

Third party services

1. Supabase

We will need a Supabase account to build a project, retrieve its URL and ANON key and create a user_authentication database, that will connect our UI to the backend, database-centered user-management.

In order to do that, we:

  1. Create a Supabase account
  2. Go to our dashboard
  3. Create a new project
  4. Go to Project Settings > API and copy URL under Project URL and anon public key under Project API Keys
  5. Copy the URL to supa_url and the ANON key to supa_key in .streamlit/secrets.toml
  6. Open SQL editor on Supabase and execute the following command:
CREATE TABLE user_authentication (
    id BIGINT GENERATED ALWAYS AS IDENTITY PRIMARY KEY,
    username VARCHAR(255) DEFAULT NULL,
    password VARCHAR(255) DEFAULT NULL,
    email VARCHAR(255) DEFAULT NULL,
    name VARCHAR(255) DEFAULT NULL,
    created_at TIMESTAMP DEFAULT NOW()
);

2. Courier

We want to send email notifications basically for two reasons:

  • Welcome our new users upon registration
  • Send them reset passwords when they want to change their old/lost password

To do so, we use the already mentioned Courier, and so we need to:

  1. Sign up to Courier
  2. Create a new workspace
  3. Enable an e-mail service provider. The easiest and cheapest choice is Gmail: you only need to specify the Gmail account for which you want to activate the service, which will also be one that will send all the emails.
  4. Retrieve the authorization token from Settings > API Keys
  5. Copy the authorization token and place it under courier_auth_token in .streamlit/secrets.toml

Create your application

1. Build from source

We now want to create our Streamlit application with Supabase authentication and user management, and, in order to do so, we:

  1. Clone this repository and go inside it:
git clone https://github.com/AstraBert/streamlit_supabase_auth_ui.git
cd streamlit_supabase_auth_ui
  1. Create a python virtual environment and activate it:
python3 -m venv streamlit-app
source streamlit-app/bin/activate
  1. Install all the required dependencies:
python3 -m pip install -r requirements.txt
  1. Modify .streamlit/secrets.toml with the Supabase project URL (supa_url), Supabase project ANON key (supa_key) and Courier authentication token (courier_auth_token) we retrieved beforehand
  2. Run the application:
python3 -m streamlit run app.py

You can obviously customize the Streamlit application as much as you want, you will only need to integrate this peace of code to make the Supabase-based auth to work:

import streamlit as st
from .streamlit_supabase_auth_ui.widgets import __login__

__login__obj = __login__(auth_token = st.secrets["courier_auth_token"],
                    company_name = "YOUR-ORG-NAME",
                    width = 200, height = 250,
                    logout_button_name = 'Logout', hide_menu_bool = False,
                    hide_footer_bool = False,
                    lottie_url = 'https://assets2.lottiefiles.com/packages/lf20_jcikwtux.json')

LOGGED_IN= __login__obj.build_login_ui()

if LOGGED_IN == True:

   ### Your Streamlit app here!

2. Get PyPi package

We made streamlit-supabase-auth-ui also a python package available on PyPi, that you can find here.

To get it, it is sufficient to run:

python3 -m pip install streamlit-supabase-auth-ui

And the installation process will take care of mounting all the necessary dependencies✅

You can then simply import the package in your code:

import streamlit as st
from streamlit_supabase_auth_ui.widgets import __login__

__login__obj = __login__(auth_token = st.secrets["courier_auth_token"],
                    company_name = "YOUR-ORG-NAME",
                    width = 200, height = 250,
                    logout_button_name = 'Logout', hide_menu_bool = False,
                    hide_footer_bool = False,
                    lottie_url = 'https://assets2.lottiefiles.com/packages/lf20_jcikwtux.json')

Live demo

Find a live demo on HuggingFace Spaces.

Contributions

Contributions are more than welcome! See contribution guidelines for more information :)

Funding

If you found this project useful, please consider to fund it and make it grow: let's support open-source together!😊

License and rights of usage

This project is provided under MIT license: it will always be open-source and free to use.

If you use this project, please cite the author: Astra Clelia Bertelli

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

streamlit_supabase_auth_ui-0.0.1.post1.tar.gz (12.9 kB view details)

Uploaded Source

Built Distribution

File details

Details for the file streamlit_supabase_auth_ui-0.0.1.post1.tar.gz.

File metadata

File hashes

Hashes for streamlit_supabase_auth_ui-0.0.1.post1.tar.gz
Algorithm Hash digest
SHA256 5def133f9e276f980cc29c481c2d19b815efb155b1da7a0042f9058a84787cc9
MD5 642b05dcb84afdb5252b366f8c68b6bf
BLAKE2b-256 96a6edc65fdc4e38197184ca8069fd2c493f8179b0dbf9781377705bb0297fa0

See more details on using hashes here.

File details

Details for the file streamlit_supabase_auth_ui-0.0.1.post1-py3-none-any.whl.

File metadata

File hashes

Hashes for streamlit_supabase_auth_ui-0.0.1.post1-py3-none-any.whl
Algorithm Hash digest
SHA256 32d298067ae0a5d1309b3aebff2189e2f2931f2d0074ac40bb2e8f8d9310f802
MD5 ea1b17719115b2ef398c7a22c14ba091
BLAKE2b-256 ea7dde986ecae586392fc9aab4c18a9e340d89d08a6962721feb4b917a783450

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page