Building Apps
Enforce authorization

Enforce authorization for private apps

💡

In this guide, you'll make your app private so only authorized end-users can access it.

You can turn your apps into private apps such as internal tools using just a few clicks.

We will assume that your app contains two pages: an authentication page located at /auth, and a protected page located at / (index).

The steps you'll need to follow to set up a private app are:

  1. Create a sign-in page with a Sign-in Widget
  2. Configure authorization rules on the project and page
  3. (optional) Set up a custom provider like Google, GitHub, Okta, OpenID Connect, and more
  4. Fetch and display the signed-in user's email
  5. Deploy your app to end-users

Step 1. Creating a sign-in page

In the Dynaboard editor, navigate to the Pages panel and click the + button to create a new page. Rename this page to auth. It will be accessible at the route /auth when your app is deployed.

Next, drag out a Sign-in Widget onto the page and follow the instructions to add a One Time PIN Authentication as your first sign-in provider. This built-in provider makes it simple to add secure email-based authentication to your app without setting up additional infrastructure.

Set up the On Success event of your sign-in widget to navigate to page / by going into the Events inspector tab and creating a function. That way, when you're done with the sign-in process, your end-user will be sent to the protected page.

Beyond that, feel free to design your authentication page as you see fit. You can add some Text and maybe an image of your logo with Media. The choice is really up to you.

Step 2. Configuring authorization rules

Next up, we'll configure the authorization rules on the protected index page to redirect unauthenticated users to the auth page.

Select the index page and find the Authorization panel on the right-side inspector panel. Click the + button and add two authentication rules that read like follows:

If:   User is authenticated
Then: Allow
If:   User is not authenticated
Then: Redirect to /auth

These rules define who can access this particular page and what to do in different circumstances. Authorization rules use an order-based priority to determine which action to take, with the first matching rule taking precedence over the others.

💡

Authorization rules are only applied when your app is deployed. If a user has edit or review access to an app, that user can browse to protected pages in the Dynaboard editor. However, you can still test your authentication process in the Dynaboard editor before performing a deployment.

Step 3. Set up a custom sign-in provider

You can configure as many sign-in providers as you'd like, or limit your app to only one. By creating any of the Auth resources you'll find in the Resources menu, your sign-in widget will be automatically configured. Please see the resource-specific reference for your authentication provider of choice.

Currently, Dynaboard supports the following authentication resources:

Step 4. Fetching the user's email

On your protected index page:

  1. Add a new Function attached to a User Session and name the function getEmail
  2. Select the Get user session action and enter email into the Accessor field
  3. Configure the function to run on page load
  4. Add a Text component to the page and enter Value: My email: {{ getEmail.data }}

Upon signing in, you'll see your email presented in the text component you just created. Piece of cake.

Step 5. Deploy your app

Hitting the Deploy button in the top-right will send your app to your end-users. Your authentication rules will apply to your deployed app. Congrats, you just created a private app with Dynaboard! Learn more about what comes next in our dedicated guide on app deployment.

Load external dataShare with teammates