![blog-post](https://ploomber.io/images/blog/stripe-flask-header_hu5fe73e647cab6390cc0eac284074fde6_51208_ecdb1e79ef8d25b51cab4c5d3f0655b4.webp)
Techniques of authenticating a Voilà app
Voilà is a popular library that lets you transform a Jupyter Notebook into an interactive dashboard, enabling you to share your work with others. Dashboards often contain sensitive or confidential information, so authentication ensures that only authorized users can access this data. Authenticated users can have personalized dashboards tailored to their specific roles or needs.
In this tutorial, we’ll look at some methods of securing your Voilà
dashboards.
Ploomber Cloud
Password Protection
Securing your applications with Ploomber Cloud
is as easy as a single click and entering your username and password. The setup process is effortless, thus making it a suitable choice for developers
of different skill levels. Ensuring security is crucial for any web application, and Ploomber Cloud prioritizes this aspect by encrypting all credentials. This encryption process transforms your username and password into a highly complex format, making it extremely challenging for unauthorized individuals to decipher. Whether you’re managing sensitive data or simply aiming to limit access to specific users, Ploomber Cloud’s encryption ensures the safety of your authentication details.
To set the credentials for your Voilà
application, turn on the Enable password protection
toggle. It should display your login credentials by default. But you can change it to the desired Username
and Password
.
Once you click on VIEW APPLICATION
after deployment completion, you’ll be prompted for the username
and password
. Enter your credentials set in the previous step for accessing the application.
The authentication process mentioned here is framework-agnostic and can be implemented in any type of application, not limited to just Voilà
.
Auth0 Authentication
Auth0 is a platform that allows developers to implement secure login processes and control access to applications. Ploomber Cloud enables you to easily secure your Voilà
applications using auth0
.
Let’s look at a sample application that contains a voila.py
configuration file and an app.ipynb
app file. We define a prelaunch-hook function in the voila.py
file that reads the auth0
username X-Auth-Name
from the request headers. Additionally, this function also injects a notebook cell in the app file for displaying the username:
import nbformat
def hook_function(req, notebook, cwd):
headers = req.request.headers
user = headers.get('X-Auth-Name', 'Anonymous')
set_user_cell = f"user = '{user}'\n"
print_user_cell = f"print(f\"Welcome {user}\")"
user_cell = nbformat.v4.new_code_cell(source=f"{set_user_cell}{print_user_cell}")
notebook.cells.insert(0, user_cell)
return notebook
c.Voila.prelaunch_hook = hook_function
Here is the notebook for displaying a simple bar chart.
To deploy this application on Ploomber Cloud, you first need to install the CLI:
pip install ploomber-cloud
Then, you can run the below command to download the sample application that demonstrates auth0 integration:
ploomber-cloud examples voila/app-with-auth0
cd
into the app-with-auth0
directory and initialize the project. This should create a ploomber-cloud.json
file with the project id
information.
ploomber-cloud init
To set up auth0
authentication for the project we need to create a new application in the Auth0
account:
Once done, note down the values of Client ID
and Domain
in the application Settings
page.
Next, run ploomber-cloud templates auth0
in the project root folder. You need to set Client ID
and Domain
as the AUTH_CLIENT_ID
and AUTH_ISSUER_BASE_URL
respectively:
ploomber-cloud templates auth0
Enter the value for AUTH_CLIENT_ID: Pi9RW***********************MQAy
Enter the value for AUTH_ISSUER_BASE_URL: dev-****************.us.auth0.com
Successfully configured auth0. To deploy, run 'ploomber-cloud deploy'
Once the auth0 setup is done you should find a .env
file with the credentials entered in the previous step. To deploy the project run ploomber-cloud deploy
. The application ID will be of the format https://application-name-1999.ploomberapp.io
. Copy this URL and set callback URLs as follows:
Once the application deployment is complete you can click on the VIEW APPLICATION
button and you should see the login page:
To learn more about auth0 integration check out the documentation.
Token Authentication
Voilà
supports token authentication by using jupyter server 2
. To enable token authentication, generate a random token using the secrets
module:
python -c 'from secrets import token_hex; print(token_hex(16))'
Now run the Voilà app using this token. It should display a login page:
voila --token=my-secret-token notebook.ipynb
Enter my-secret-token
to login:
Note that you can also use any password of your choice to set up token authentication.
Click here to learn more about token authentication.