Overview

The Authentication capability lets users authenticate with apps via third-party platforms. This makes it possible for apps to bridge the gap between Canva and external services.

Benefits

• Give users access to certain features or content based on their specific privileges.
• Let users access their own content, such as their personal files from a file storage service.
• Monetize apps by offering premium features and content.

User experience

1. The user triggers an authentication flow. (The app determines how a user does this.)
2. Canva opens a popup window.
3. Within the popup window, the user authenticates with a third-party platform.
4. At the end of the authentication flow, the popup window closes.
5. The user is logged in (or shown an error if the authentication fails).

Lifecycle

The overall lifecycle of the Authentication capability can be broken down into three stages:

• Checking a user's authentication status
• Authenticating a user
• Disconnecting an app

Each stage has its own, more granular lifecycle.

Checking a user's authentication status

1. The app's frontend sends an HTTP request to its backend with a JWT in the Authorization header. (The JWT itself is generated by Canva. See Sending requests).
2. The app's backend extracts the user's ID from the JWT's payload.
3. The app's backend checks if the ID is associated with a user.
4. The app's backend returns the user's authentication status.
5. The app's frontend determines what to render based on the user's authentication status.

Authenticating a user

1. The app's frontend initializes the Authentication capability.
2. The app's frontend calls the authenticate method.
3. Canva opens a popup window.
4. Within the popup window:
   1. Canva redirects the user to the app's Redirect URL.
   2. The user navigates through the app's authentication flow.
   3. The app redirects the user back to Canva.
5. Canva closes the popup window.
6. The authenticate method returns an AuthenticationResult object.

Disconnecting an app

1. The user disconnects the app via Canva's UI.
2. Canva sends a POST request to the app's backend.
3. The app's backend removes any connection between the user and Canva.
4. The app's backend returns a confirmation of the disconnection.