Skip to content
Salesforce Dictionary - Free Salesforce GlossarySalesforce Dictionary
DictionaryCCanvas App Previewer
PlatformAdvanced

Canvas App Previewer

The Canvas App Previewer is a Salesforce Setup tool that lets you see what a canvas app will look like before you publish it to users.

§ 01

Definition

The Canvas App Previewer is a Salesforce Setup tool that lets you see what a canvas app will look like before you publish it to users. A canvas app is a third-party web application, written in any language and hosted outside Salesforce, that the Canvas framework embeds inside the Salesforce UI through an iframe. The Previewer renders that external app inside Salesforce so you can test and debug it during development.

You reach the Previewer from the Quick Find box in Setup, then click a canvas app in the left-hand pane to load it in the preview frame. It runs as the logged-in user and constructs the same context that production Canvas would send, so the embedded app receives a realistic payload. Seeing the app behave correctly here is the signal that it is ready to be embedded in a Lightning page, a Visualforce page, or the publisher.

§ 02

Inside the Canvas App Previewer

What a canvas app is

A canvas app is an external web application that the Canvas framework surfaces inside Salesforce. You write it in the language of your choice and host it on your own infrastructure or a platform such as Heroku. Salesforce loads it in an iframe and hands it context about the running user, the org, the environment, and sometimes the current record. The Canvas framework is a set of tools and JavaScript APIs that make this embedding possible, so a system that lives outside Salesforce can still feel like part of the interface. Canvas predates Lightning Web Components and was the original answer to a recurring need: show a partner-built or legacy web UI next to Salesforce data without rebuilding it on the platform. The app authenticates through one of two methods, a signed request or OAuth 2.0, and that handshake is what proves to the external app that the request genuinely came from Salesforce on behalf of a real user. Because the app runs as an iframe with its own origin, getting the embedding, the authentication, and the context propagation all working together is the hard part. That is exactly what the Previewer exists to shorten.

How the Previewer renders your app

The Previewer is a Setup page, found by typing Canvas App Previewer into the Quick Find box. The left-hand pane lists the canvas apps you have defined in your org. Clicking one loads it into the preview frame on the right, where it renders the same way it would once embedded in Salesforce. The official description is plain: it is a development tool that lets you see what your canvas apps will look like before you publish them. The Previewer is available in Enterprise, Performance, Unlimited, Developer, and Professional editions, the last requiring API access and Lightning Platform Canvas to be enabled, and it works in both Salesforce Classic and Lightning Experience. The value is the speed of the loop. You change code on the external host, refresh the Previewer, and watch the result inside a real Salesforce frame. You do not have to build out a destination location, drop the app onto a record page, and click through to it every time you want to test a small change. The frame behaves like the production embedding, so layout problems, sizing issues, and rendering quirks all show up here first.

Authentication and context during preview

A canvas app cannot trust an incoming request just because it loaded in a browser. The Canvas framework solves this with two authentication options. With a signed request, Salesforce posts a signed JSON payload to the app URL, and the app verifies the signature using the connected app consumer secret before trusting any of the data. With OAuth 2.0, the app runs a standard authorization flow and then calls a context endpoint to retrieve the same information. Either way the payload carries user details, organization details, environment data, and, where relevant, the record the app was launched from. The Previewer runs as the signed-in user and builds this context for you, so the embedded app receives a realistic signed request rather than a hand-faked one. This is what makes the Previewer useful beyond a simple visual check. You can confirm that your signature verification works, that you are reading the right fields out of the payload, and that record context arrives as expected. A signed request that the app rejects almost always points to a clock skew problem on your server or to the wrong consumer secret, and the Previewer surfaces that failure early.

Permissions needed to see it

The Previewer is gated behind two strong user permissions: Customize Application and Modify All Data. If you do not see the Canvas App Previewer item in Setup, the usual cause is that your user lacks one of these. Administrators normally hold both already, so for most admins the menu item simply appears. A developer working under a tighter profile may need a permission set that grants them, which is worth knowing before you spend time hunting for a missing Setup page. These permissions are deliberately broad because creating and previewing canvas apps is a configuration and integration activity, not an everyday end-user task. Treat Previewer access as a development-time grant rather than something to hand out widely. In a shared sandbox, it is reasonable to give the integration team these permissions through a dedicated permission set so the grant is easy to audit and remove later. Keep in mind that the same Customize Application permission also controls whether canvas apps show up in the App Launcher on mobile, so permission planning for canvas work spans both the build surface and the runtime surface.

Where the previewed app eventually lives

The Previewer is the build-time view; it is not where the app runs in production. Once the app behaves correctly, you choose real locations for it. Canvas apps can appear on a Visualforce page, inside a Lightning page through the force:canvasApp component, in the Chatter publisher, in the console sidebar, in the Salesforce mobile app, and on Experience Cloud sites. Each location is configured separately, and the legacy component reference is explicit that you should test and debug the canvas app in the Previewer before embedding it in a Lightning or Aura component. That sequencing matters. The Previewer isolates the integration from the host page, so when something breaks after embedding, you already know the app itself works and can focus on the placement. Production rollout also depends on the connected app definition that backs the canvas app, including its OAuth scopes and signed-request setting, plus the locations you enable and the users you grant access to. The Previewer lets you settle the app behavior first, then layer on the placement and access decisions without debugging everything at once.

Where Canvas fits in modern Salesforce

Canvas arrived when Visualforce was the main way to build custom UI and neither Aura components nor Lightning Web Components existed yet. For in-platform interfaces today, Lightning Web Components are the default choice, because they run natively on the platform, share its styling, and avoid the iframe boundary entirely. So canvas apps and the Previewer are not where most new UI work begins. Canvas still earns its place when the application genuinely has to live outside Salesforce. A partner ships a hosted product you cannot rebuild. A legacy internal system already has a working web UI. A third party provides a component you embed rather than reimplement. In those cases the Canvas framework gives you a supported way to bring that external surface into Salesforce with proper authentication and context, and the Previewer remains the fastest way to get it working. Reading the term this way keeps expectations honest. If you control the code and the data is in Salesforce, reach for an LWC. If the UI must stay external, Canvas is the tool, and the Previewer is your first stop.

§ 03

Preview a canvas app before you publish it

Use the Canvas App Previewer to load and debug a canvas app inside Salesforce before you embed it anywhere. You need a defined canvas app and the right permissions first.

  1. Confirm your permissions

    Make sure your user has Customize Application and Modify All Data. Without both, the Canvas App Previewer item does not appear in Setup. Most admins already have them.

  2. Open the Previewer

    In Setup, type Canvas App Previewer into the Quick Find box and select it. The page lists the canvas apps defined in your org in the left-hand pane.

  3. Load your canvas app

    Click your canvas app in the left-hand pane. It renders in the preview frame on the right, running as you, with a real Salesforce context payload.

  4. Debug and iterate

    Use browser developer tools on the frame to inspect the signed request, the context, and any callbacks. Change the external app, refresh, and repeat until it behaves.

Authentication typeremember

Signed request posts a signed payload the app verifies with the consumer secret; OAuth 2.0 runs an authorization flow then fetches context.

Edition requirementremember

Available in Enterprise, Performance, Unlimited, and Developer editions, and in Professional with API access and Lightning Platform Canvas enabled.

Running contextremember

The Previewer builds the context as the logged-in user, so the app receives user, org, environment, and where relevant record details.

Gotchas
  • If the Previewer menu item is missing, the cause is almost always a missing Customize Application or Modify All Data permission, not a licensing problem.
  • Signed-request verification failures on the app side usually trace to server clock skew or the wrong consumer secret, not to the Salesforce-side setup.
  • The Previewer is a development surface only. Production access still depends on the connected app definition, the enabled locations, and user assignments.

Prefer this walkthrough as its own page? How to Canvas App Previewer in Salesforce, step by step

§

Trust & references

Sources

Cross-checked against the following references.

Official documentation

Straight from the source - Salesforce's reference material on Canvas App Previewer.

Keep learning

Hands-on resources to go deeper on Canvas App Previewer.

Was this entry helpful?
Help us write better definitions. Quick reactions or detailed edit suggestions.

About the Author

Dipojjal Chakrabarti is a B2C Solution Architect with 29 Salesforce certifications and over 13 years in the Salesforce ecosystem. He runs salesforcedictionary.com to help admins, developers, architects, and cert/interview candidates sharpen their fundamentals. More about Dipojjal.

§

Test your knowledge

Q1. Who benefits most from understanding Canvas App Previewer?

Q2. What architecture concept does Canvas App Previewer demonstrate?

Q3. How does Canvas App Previewer fit into developer workflows?

§

Discussion

Loading…

Loading discussion…