apex:canvasApp Component

Use this component to display a canvas app on a Visualforce page. The table below lists the component attributes.

Pass parameters that contain non-alphanumeric characters such as quotation marks, apostrophes, and so on, as JavaScript-safe objects. To do this, write an Apex class that uses the methods of the Apex JSONGenerator class to build the JSON string. Call the Apex class from the parameters value:

1<apex:page controller="JSONGeneratorSample">
2 <apex:canvasApp developerName="mycanvas" parameters="{!generateJSON}" />
3</apex:page>

Alternatively, you can also use the JSENCODE function to escape the strings:

1<apex:page standardController="Account">
2 <apex:canvasApp developerName="mycanvas" parameters="{!JSENCODE(Account.Description)}" />
3</apex:page>

Attribute	Type	Description
`applicationName`	String	Name of the canvas app. Either `applicationName` or `developerName` is required.
`border`	String	Width of the canvas app border, in pixels. If not specified, defaults to 0 pixels.
`canvasId`	String	Unique ID of the canvas app window. Use this attribute when targeting events to the canvas app.
`containerId`	String	ID of the HTML element in which the canvas app is rendered. If not specified, defaults to null. The container specified by this attribute can’t appear after the `<apex:canvasApp>` component.
`developerName`	String	Internal name of the canvas app. You specify this value in the `API Name` field when you expose the canvas app by creating a connected app. Either `developerName` or `applicationName` is required.
`entityFields`	String	Specifies the fields returned in the signed request Record object when the component appears on a Visualforce page placed on an object. If this attribute isn’t specified or is blank, only the Id field is returned. Use a comma-separated list of field names (for example, `entityFields="Phone,Fax"`) or an asterisk (`*`) to return all fields from the associated object.
`height`	String	Canvas app window height, in pixels. If not specified, defaults to 900 pixels.
`id`	String	Unique identifier that allows the `<apex:canvasApp>` component to be referenced by other components on the page.
`maxHeight`	String	The maximum height of the Canvas app window in pixels. Defaults to 2000 px; ‘infinite’ is also a valid value.
`maxWidth`	String	The maximum width of the Canvas app window in pixels. Defaults to 1000 px; ‘infinite’ is also a valid value.
`namespacePrefix`	String	Namespace value of the Developer Edition organization in which the canvas app was created. You can set a namespace only in a Developer Edition organization, so this is optional if the canvas app was created in a different type of organization. If not specified, defaults to null.
`onCanvasAppError`	String	Name of the JavaScript function to be called if the canvas app fails to render.
`onCanvasAppLoad`	String	Name of the JavaScript function to be called after the canvas app loads.
`parameters`	String	Object representation of parameters passed to the canvas app. Supply in JSON format or as an expression to a JavaScript JSON object literal. If not specified, defaults to null.
`rendered`	Boolean	Specifies whether the component is rendered on the page. If not specified, defaults to true.
`scrolling`	String	Specifies whether the canvas app window uses scroll bars. Valid values are `auto`, `no`, or `yes`. If not specified, defaults to `no`. If this attribute contains an invalid value, it’s treated the same as `no` to prevent browser errors.
`width`	String	Canvas app window width, in pixels. If not specified, defaults to 800 pixels.

These code examples show valid usage of the <div> container and the containerId attribute:

1<apex:page>
2    <div id="container1"></div>
3    <apex:canvasApp applicationName="myApp" containerId="container1"/>
4</apex:page>
5
6<apex:page>
7    <div id="container1">
8        <apex:canvasApp applicationName="myApp" containerId="container1"/>
9    </div>
10</apex:page>

This code example shows invalid usage of the <div> container and the containerId attribute:

1<apex:page>
2    <apex:canvasApp applicationName="myApp" containerId="container1"/>
3    <div id="container1">
4    </div>
5</apex:page>

Returning Fields in the Record Object

When you use the <apex:canvasApp> component to display a canvas app on a Visualforce page, and that page is associated with an object (placed on the page layout, for example), you can specify fields to be returned from the related object. To do this, use the entityFields attribute. You can use this attribute in one of the following ways.

See Also