Preview with Protected Vercel Environments

Last updated: June 22, 2026

Problem Statement

When Vercel Deployment Protection (Authentication, Password Protection, Trusted IPs) is enabled, Canvas Preview fails with "not authorized" responses. Canvas Preview runs in an iframe, and Vercel's authentication cookie uses SameSite=Lax, so it is not sent with cross-origin requests from the iframe. The fix is Vercel's Protection Bypass feature.

Solution

1. Enable Protection Bypass for Automation in Vercel

  1. Open your Vercel project dashboard.

  2. Go to Settings > Deployment Protection.

  3. Enable Protection Bypass for Automation.

  4. Copy the generated secret.

2. Add the bypass parameters to your Canvas Preview URL

Append these two query string parameters to the preview URL:

  • x-vercel-protection-bypass=<your-vercel-bypass-secret>

  • x-vercel-set-bypass-cookie=samesitenone

Resulting format:

https://your-vercel-url/api/preview?secret=<your-preview-secret>&x-vercel-protection-bypass=<your-vercel-bypass-secret>&x-vercel-set-bypass-cookie=samesitenone

The bypass only applies to requests carrying the correct secret, so your protected environments stay closed to public access while Canvas Preview works.

Troubleshooting

Verify it works: reload Canvas Preview — the protected Vercel environment renders without an authorization prompt or "not authorized" error.

Still getting "not authorized": confirm Protection Bypass for Automation is enabled in the Vercel project and that the secret in the URL matches the generated one exactly.

Cookie not persisting in the iframe: make sure x-vercel-set-bypass-cookie=samesitenone is included — samesitenone is required for the cookie to be sent from the Canvas Preview iframe.

References: https://vercel.com/docs/deployment-protection/methods-to-bypass-deployment-protection