New `@canva/app-middleware` package!

Hey Canva developers,

A little overdue, but in an effort to improve our Developer Experience, we’re packaging up as much of our SDK functionality as possible, to allow for easy updates and better version control. So, we’re excited to announce that @canva/app-middleware is now available on npm! This preview SDK makes it super easy to verify JWT tokens in your Node.js backend services, and replaces jwt_middleware and design_token modules that were previously included in the Apps SDK Starter Kit.

What does it do?

If you’re building apps with Canva, you need to verify tokens to authenticate users and access design context. We’ve built a comprehensive SDK that handles:

Feature highlight

Express.js middleware - Drop-in middleware for Express apps that automatically verifies tokens and adds decoded payloads to your requests

import { user } from "@canva/app-middleware/express";

app.post(
  "/api/user/profile",
  user.verifyToken({ appId: "your-app-id" }),
  (req, res) => {
    const userId = req.canva.user.userId!;
    // Your code here
  }
);

Framework primitives - Core verification functions work anywhere - Next.js, AWS Lambda, Cloudflare Workers, Fastify, Hono, or any Node.js environment

import { initUserTokenVerifier } from "@canva/app-middleware";

const verifier = initUserTokenVerifier({ appId: "your-app-id" });
const payload = await verifier.verifyToken(token);

Token extraction utils - Built-in support for Authorization headers, query strings, cookies, or build your own custom extractor

This is a preview

We’re releasing this as a preview to get your feedback early. Try it out, kick the tires, and let us know what you think. What works well? What’s missing? What’s confusing? Your input will help shape the final release.

Get started

Install from npm:

npm install @canva/app-middleware@latest

Check out the docs:

npm package:

We’d love to hear your feedback, so please do not hesitate to reach out with any questions.

Cheers
Anto