Authentication
You can configure an app to support authentication. If an app supports authentication, users must authenticate with a third-party platform before accessing the app's extensions.
For example, apps with a publish extension may support authentication to ensure that only users who are registered with the publish destination can publish their designs.
This topic explains what authentication is and how it works.
If you have enabled authentication for an app, you must also implement and pass signature verification checks before submitting your app.
Examples of authentication
These are some examples of apps that support authentication:
- Bitmoji(opens in a new tab or window)
- Brandfetch(opens in a new tab or window)
- Pixton(opens in a new tab or window)
For more examples, see canva.com/apps(opens in a new tab or window).
How users experience authentication
When a user opens an extension in an authentication-enabled app, they see a Connect button.
If the user clicks this button, a pop-up window appears and loads an authentication screen for a third-party platform.
The user can log in to or sign up for an account with the platform. (The exact authentication method is entirely dependent on the platform.)
Once the user authenticates:
- The pop-up window closes.
- The extension reloads.
- The user gains access to the extension's content or options.
After authenticating, the user can choose to revoke authentication.
If you click the Connect button, minimize the pop-up window, and click the Connect button again, the pop-up window is blank. This is a bug that's in our backlog.
How authentication works
When Canva sends an HTTP request to an extension, the body of the request includes the ID of the current user. An extension uses this ID to check if it's associated with a user in a third-party platform's backend.
If the ID is associated with a user, it can load the extension with content or options specific to that user. For example, a content extension may only retrieve content belonging to that user.
If the ID is not associated with a user, the extension can render a Connect button, which, once the user clicks, begins the authentication flow. How an extension handles the authentication flow depends on the extension point. To learn more, see the extension-specific guides:
The authentication flow is:
- A user clicks on the Connect button.
- Canva opens a pop-up window and redirects them to the app's Redirect URL. You can configure this URL via the Developer Portal.
- The Redirect URL takes the user to a page that's hosted on the third-party platform. This page must let users sign up for or log in to an account with the platform.
- The user logs in at the redirect URL location.
- Canva appends a
user
parameter to the Redirect URL. This parameter contains the ID of the current Canva user. Canva uses this parameter to associate the user in Canva's backend with the user in the platform's backend. - The extension redirects the user back to Canva from within the pop-up window. This closes the pop-up window and reloads the extension.
- Once again, the extension receives a request that contains the ID of the user. Since this user is now associated with a user in the platform's backend, it can load with content or options specific to that user.
Canva's platform is designed to support all methods of authentication, so it doesn't matter how users sign up or log in via the pop-up window, but some common methods include:
- Username and password
- OAuth 2.0
- QR codes
For guidelines on providing a friendly and familiar-looking Redirect URL, see Provide a user-friendly Redirect URL.
Team-scoped authentication
All Canva users can be a member of one or more teams(opens in a new tab or window). Canva includes the ID of the user's current team in all requests it sends to an extension. This lets the extension offer team-specific features.
Canva's APIs refers to the user's team as their brand.
Limitations
- You can only enable authentication for an entire app, not an individual extension.
Additional considerations
- The ID of the user is obfuscated and unique to each app. If the same user authenticates with a different app, their ID is different.
- The ID of the user is unique to each team. If a user switches to a different team and uses the same app, their ID is different.
- The authentication flow of public apps must adhere to the UX guidelines. When you submit an app for review, Canva checks that the app is following these guidelines.
- When a user starts an authentication flow, Canva redirects them to the app's Redirect URL. The app must verify the request signature of this request.