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.3.0/canopy-connect.js"></script>

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.

const handler = CanopyConnect.create({
  // [Optional string] to skip the first screen in the widget, you can supply a consent token. See the “Usage with Consent API” section for more details.
  consentToken: "<CONSENT_TOKEN_OBTAINED_FROM_OUR_CONSENT_API>",
  publicAlias: "<YOUR_WIDGET_PUBLIC_ALIAS>",
  onAuthenticationSuccess: (data) => {
    // [Optional callback] called when user is authenticated
  },
  onExit: (err, data) => {
    // [Optional callback] called when user exits flow (including after authenticating successfully)
  },
  onDestroy: () => {
    // [Optional callback] called when you use the `handler.destroy()` method below
  },
  onSelectCustomInsuranceProvider: ({ providerName }) => {
    // [Optional callback] called when user selects a custom insurer on a link that has the custom insurer button enabled
  },
  pullMetaData: {
    // arbitrary JSON-serializable data. The API returns this data in Pull.meta_data
  },
});
handler.open(); // show Canopy Connect modal
handler.close(); // close Canopy Connect modal
handler.destroy(); // destroy Canopy Connect modal (optional - removes all DOM elements and event listeners)