How to securely authenticate users into your Streamlit app
Hey, community! š
My name is Mohammad Khorasani, and Iām a co-author of the book Web Application Development with Streamlit (Streamlit helped me get into full-stack development, so it was only fair to spread the word about it).
As developers, we often require features that are yet to be made natively. For me, that was implementing user authentication and privileges in a client-related project that eventually grew into a full-fledged package aptly named Streamlit-Authenticator.
Specifically, my client asked for the ability to authenticate users with different privilege levels for their business needs, as well as a whole host of other features. Thatās what prompted me into developing this package. While authentication is definitely needed for some appsāespecially corporate onesāit's great to make your apps accessible to the community whenever possible to share and spread the learnings!
In this two-part tutorial, youāll learn:
- How to install Streamlit-Authenticator
- How to hash user passwords
- How to create a login widget
- How to authenticate users
- How to implement user privileges
How to install Streamlit-Authenticator
Letās start by creating a login form to authenticate a list of predefined users. Install the component by using the following command:
pip install streamlit-authenticator
Next, import the component into your Python script:
import streamlit_authenticator as stauth
How to hash user passwords
Itās absolutely vital to hash any password that will be stored on a disk, database, or any other medium. Here, youāll be defining your usersā credentials in a YAML file.
Youāll also define several other configuration settings pertaining to the key and expiry date of the re-authentication JWT cookie. If you donāt require passwordless re-authentication, just set the expiry_days to 0.
You can also define a preauthorized list of users who can register their usernames and passwords (Iāll cover this in the next post in this series).
Step 1. Create the YAML file:
credentials:
usernames:
jsmith:
email: jsmith@gmail.com
name: John Smith
password: '123' # To be replaced with hashed password
rbriggs:
email: rbriggs@gmail.com
name: Rebecca Briggs
password: '456' # To be replaced with hashed password
cookie:
expiry_days: 30
key: random_signature_key
name: random_cookie_name
preauthorized:
emails:
- melsby@gmail.com
Step 2. Use the Hasher module to convert your plain text passwords into hashed passwords:
hashed_passwords = stauth.Hasher(['123', '456']).generate()
Step 3. Replace the plain text passwords in the YAML file with the generated hashed passwords.
Now that youāve defined your usersā credentials and configuration settings, youāre ready to create an authenticator object.
Step 1. Import the YAML file into your script:
with open('../config.yaml') as file:
config = yaml.load(file, Loader=SafeLoader)
Step 2. Create the authenticator object:
authenticator = Authenticate(
config['credentials'],
config['cookie']['name'],
config['cookie']['key'],
config['cookie']['expiry_days'],
config['preauthorized']
)
Step 3. Render the login widget by providing a name for the form and its location (i.e., sidebar or main):
name, authentication_status, username = authenticator.login('Login', 'main')
How to authenticate users
Once you have your authenticator object up and running, use the return values to read the name, authentication_status, and username of the authenticated user.
You can ppt-in for a logout button and add it as follows:
if authentication_status:
authenticator.logout('Logout', 'main')
st.write(f'Welcome *{name}*')
st.title('Some content')
elif authentication_status == False:
st.error('Username/password is incorrect')
elif authentication_status == None:
st.warning('Please enter your username and password')
Or you can access the same values through a session state:
if st.session_state["authentication_status"]:
authenticator.logout('Logout', 'main')
st.write(f'Welcome *{st.session_state["name"]}*')
st.title('Some content')
elif st.session_state["authentication_status"] == False:
st.error('Username/password is incorrect')
elif st.session_state["authentication_status"] == None:
st.warning('Please enter your username and password')
You can also alter the user if their credentials are incorrect:
After logging out, the authentication_status will revert back to None and the authentication cookie will be removed.
How to implement user privileges
Given that the authenticator object returns the username of your logged-in user, you can utilize that to implement user privileges where each user receives a more personalized experience as shown below:
name, authentication_status, username = authenticator.login('Login', 'main')
if authentication_status:
authenticator.logout('Logout', 'main')
if username == 'jsmith':
st.write(f'Welcome *{name}*')
st.title('Application 1')
elif username == 'rbriggs':
st.write(f'Welcome *{name}*')
st.title('Application 2')
elif authentication_status == False:
st.error('Username/password is incorrect')
elif authentication_status == None:
st.warning('Please enter your username and password')
As you can see, each user is redirected to a separate application to cater to that specific userās needs.
Wrapping up
I hope you feel confident now about securely authenticating users into your Streamlit application. In subsequent posts, youāll learn how to register new users, reset usernames/passwords, and update user data.
In the meantime, feel free to read more about this component in our book Web Application Development with Streamlit. And if you have any questions, please leave them in the comments below or contact me on LinkedIn.
Happy Streamlit-ing! š
This is a companion discussion topic for the original entry at https://blog.streamlit.io/streamlit-authenticator-part-1-adding-an-authentication-component-to-your-app/
