Use the SDK to embed a Canopy Connect widget on your website or mobile app. You can trigger the widget to open or close, attach your own metadata to a data Pull, and build an end-to-end user experience with the insurance data you collect via Canopy Connect.

Installation

Include the Canopy Connect initialization script on your site. It should always be loaded
directly from https://cdn.usecanopy.com, rather than hosted yourself.

<script src="https://cdn.usecanopy.com/v2/canopy-connect.js"></script>

🚧
Subresource Integrity (SRI) verification
Do not use Subresource Integrity (SRI) verification in the script tag. Canopy Connect regularly deploys updates and improvements to the SDK. Using a Subresource Integrity check will fail when we deploy updates to the SDK.

Usage

📘
How to find your public alias
Each link has a unique public alias. You can view all your links on the Links Page. The public alias is what follows after the /c/in your link's url. Example: the public alias for https://app.usecanopy.com/c/demois demo.

Initialize a SDK Handler:

const handler = CanopyConnect.create({
	publicAlias: "<YOUR_WIDGET_PUBLIC_ALIAS>",
  pullMetaData: {
  	yourUserIdentifier: "123"
  },
});

For more Handler options, methods and events, refer to the Reference Documentation

Then, use the handler to open the Canopy Connect modal:

document.getElementById('your-open-button').on('click', async () => {
  handler.open() // Opens Canopy Connect modal
});

Examples

Plain Javascript Demo

React Demo

What’s Next

What’s Next