Skip to main content

Connect Widget Overview

Connect users to their financial institutions and retrieve their data using our API

image of the Connect Widget

What's the Connect Widget?

The Connect Widget lets end users search for and connect to their accounts. It collects users' credentials, prompts for multifactor authentication, and resolves connection errors between end users and their financial institutions.

You'll embed the widget into your website or mobile app.

We offer a React Native SDK for mobile implementations and a Web SDK for desktop implementations. The SDKs are the preferred implementation method and provide an improved interface for handling event messaging (like postMessages) and OAuth connections.

info

Want to try the widget yourself? See our demo app.

When you're ready to implement the Connect Widget, see our Implementation Guides.

What Data You Can Receive

When an end user connects to their account using the Connect Widget, a member (which represents the user's connection to an institution) is created in the Platform API.

After an end user has connected to their account, the widget will aggregate data for different products depending on how you've configured the widget in your request.

From then on, the member and its associated accounts will aggregate depending on how you've configured the widget and what other requests you've made. For example, one way you could disable background aggregation (aggregation that automatically occurs every 24 hours) is by setting disable_background_agg to true in your request. For more information on aggregation, see Background and Foreground Aggregation.

You’ll use a Platform API endpoint to load and configure the Connect Widget. For help with this, see Configure Your Connect Widget.

You’ll use separate API endpoints to actually read the data the widget has aggregated, which can include:

Account and transaction data (using our Account Aggregation product)

See Account Aggregation for more info.

This sample response shows the data you can expect to get for financial accounts.


_59
{
_59
"accounts": [
_59
{
_59
"account_number": "5366",
_59
"apr": 1.0,
_59
"apy": 1.0,
_59
"available_balance": 1000.0,
_59
"available_credit": 1000.0,
_59
"balance": 1000.0,
_59
"cash_balance": 1000.0,
_59
"cash_surrender_value": 1000.0,
_59
"created_at": "2016-10-13T17:57:37.000Z",
_59
"credit_limit": 100.0,
_59
"currency_code": "USD",
_59
"day_payment_is_due": 20,
_59
"death_benefit": 1000,
_59
"guid": "ACT-06d7f44b-caae-0f6e-1384-01f52e75dcb1",
_59
"holdings_value": 1000.0,
_59
"id": "1040434698",
_59
"imported_at": "2015-10-13T17:57:37.000Z",
_59
"institution_code": "chase",
_59
"insured_name": "Frodo Baggins",
_59
"interest_rate": 1.0,
_59
"is_closed": false,
_59
"is_hidden": false,
_59
"last_payment": 100.0,
_59
"last_payment_at": "2015-10-13T17:57:37.000Z",
_59
"loan_amount": 1000.0,
_59
"matures_on": "2015-10-13T17:57:37.000Z",
_59
"member_guid": "MBR-3bdc7d6b-efd4-1497-a0af-b23501cf9bd0",
_59
"member_id": "member-9876",
_59
"member_is_managed_by_user": false,
_59
"metadata": "some metadata",
_59
"minimum_balance": 100.0,
_59
"minimum_payment": 10.0,
_59
"name": "Test account 2",
_59
"nickname": "My Checking",
_59
"original_balance": 10.0,
_59
"pay_out_amount": 10.0,
_59
"payment_due_at": "2015-10-13T17:57:37.000Z",
_59
"payoff_balance": 10.0,
_59
"premium_amount": 1.0,
_59
"routing_number": "68899990000000",
_59
"started_on": "2015-10-13T17:57:37.000Z",
_59
"subtype": "NONE",
_59
"total_account_value": 1.0,
_59
"type": "SAVINGS",
_59
"updated_at": "2016-10-13T18:08:00.000Z",
_59
"user_guid": "USR-11141024-90b3-1bce-cac9-c06ced52ab4c",
_59
"user_id": "partner-2345"
_59
}
_59
],
_59
"pagination": {
_59
"current_page": 1,
_59
"per_page": 25,
_59
"total_entries": 1,
_59
"total_pages": 1
_59
}
_59
}

This sample response shows the data you can expect to get for transactions.


_56
{
_56
"pagination": {
_56
"current_page": 1,
_56
"per_page": 10,
_56
"total_entries": 243,
_56
"total_pages": 25
_56
},
_56
"transactions": [
_56
{
_56
"account_guid": "ACT-06d7f44b-caae-0f6e-1384-01f52e75dcb1",
_56
"account_id": "account123",
_56
"amount": 61.11,
_56
"category": "Groceries",
_56
"category_guid": "CAT-9588eaad-90a4-bb5c-66c8-1812503d0db8",
_56
"check_number_string": "6812",
_56
"created_at": "2016-10-06T09:43:42.000Z",
_56
"currency_code": "USD",
_56
"date": "2013-09-23T00:00:00.000Z",
_56
"description": "Whole foods",
_56
"extended_transaction_type": "partner_transaction_type",
_56
"guid": "TRN-265abee9-889b-af6a-c69b-25157db2bdd9",
_56
"id": "transaction-265abee9-889b-af6a-c69b-25157db2bdd9",
_56
"is_bill_pay": false,
_56
"is_direct_deposit": false,
_56
"is_expense": true,
_56
"is_fee": false,
_56
"is_income": false,
_56
"is_international": false,
_56
"is_overdraft_fee": false,
_56
"is_payroll_advance": false,
_56
"is_recurring": false,
_56
"is_subscription": false,
_56
"latitude": -43.2075,
_56
"localized_description": "This is a localized_description",
_56
"localized_memo": "This is a localized_memo",
_56
"longitude": 139.691706,
_56
"member_guid": "MBR-3bdc7d6b-efd4-1497-a0af-b23501cf9bd0",
_56
"member_is_managed_by_user": false,
_56
"memo": "This is a memo",
_56
"merchant_category_code": 5411,
_56
"merchant_guid": "MCH-7ed79542-884d-2b1b-dd74-501c5cc9d25b",
_56
"merchant_location_guid": "MCL-00024e59-18b5-4d79-b879-2a7896726fea",
_56
"metadata": "some metadata",
_56
"original_description": "WHOLEFDS TSQ 102",
_56
"posted_at": "2016-10-07T06:00:00.000Z",
_56
"status": "POSTED",
_56
"top_level_category": "Food & Dining",
_56
"transacted_at": "2016-10-06T13:00:00.000Z",
_56
"type": "DEBIT",
_56
"updated_at": "2016-10-07T05:49:12.000Z",
_56
"user_guid": "USR-11141024-90b3-1bce-cac9-c06ced52ab4c",
_56
"user_id": "partner-2345"
_56
},
_56
// •••
_56
]
_56
}

Account and routing numbers (using our Instant Account Verification product)

See Instant Account Verification for more info.

This sample response shows the data you can expect to get for account owners.


_20
{
_20
"account_numbers": [
_20
{
_20
"account_guid": "ACT-82a93692-f756-534f-9b2e-ad10a0f38462",
_20
"account_number": "10001",
_20
"institution_number": null,
_20
"member_guid": "MBR-3bdc7d6b-efd4-1497-a0af-b23501cf9bd0",
_20
"routing_number": "091000019",
_20
"passed_validation": true,
_20
"transit_number": null,
_20
"user_guid": "USR-11141024-90b3-1bce-cac9-c06ced52ab4c"
_20
}
_20
],
_20
"pagination": {
_20
"current_page": 1,
_20
"per_page": 25,
_20
"total_entries": 1,
_20
"total_pages": 1
_20
}
_20
}

Account owner data (using our Account Owner Identification product)

See Account Owner Identification for more info.

This sample response shows the data you can expect to get for account owners.


_26
{
_26
"account_owners": [
_26
{
_26
"account_guid": "ACT-82a93692-f756-534f-9b2e-ad10a0f38462",
_26
"address": "123 This Way",
_26
"city": "Middlesex",
_26
"country": "US",
_26
"email": "donnie@darko.co",
_26
"first_name": "Donnie",
_26
"guid": "ACO-63dc7714-6fc0-4aa2-a069-c06cdccd1af9",
_26
"last_name": "Darko",
_26
"member_guid": "MBR-3bdc7d6b-efd4-1497-a0af-b23501cf9bd0",
_26
"owner_name": "Donnie Darko",
_26
"phone": "555-555-5555",
_26
"postal_code": "00000-0000",
_26
"state": "VA",
_26
"user_guid": "USR-11141024-90b3-1bce-cac9-c06ced52ab4c"
_26
}
_26
],
_26
"pagination": {
_26
"current_page": 1,
_26
"per_page": 25,
_26
"total_entries": 1,
_26
"total_pages": 1
_26
}
_26
}

Transaction data

You can configure the widget to return transactions when its mode is set to verification.

This sample response shows the data you can expect to get for transactions.


_56
{
_56
"pagination": {
_56
"current_page": 1,
_56
"per_page": 10,
_56
"total_entries": 243,
_56
"total_pages": 25
_56
},
_56
"transactions": [
_56
{
_56
"account_guid": "ACT-06d7f44b-caae-0f6e-1384-01f52e75dcb1",
_56
"account_id": "account123",
_56
"amount": 61.11,
_56
"category": "Groceries",
_56
"category_guid": "CAT-9588eaad-90a4-bb5c-66c8-1812503d0db8",
_56
"check_number_string": "6812",
_56
"created_at": "2016-10-06T09:43:42.000Z",
_56
"currency_code": "USD",
_56
"date": "2013-09-23T00:00:00.000Z",
_56
"description": "Whole foods",
_56
"extended_transaction_type": "partner_transaction_type",
_56
"guid": "TRN-265abee9-889b-af6a-c69b-25157db2bdd9",
_56
"id": "transaction-265abee9-889b-af6a-c69b-25157db2bdd9",
_56
"is_bill_pay": false,
_56
"is_direct_deposit": false,
_56
"is_expense": true,
_56
"is_fee": false,
_56
"is_income": false,
_56
"is_international": false,
_56
"is_overdraft_fee": false,
_56
"is_payroll_advance": false,
_56
"is_recurring": false,
_56
"is_subscription": false,
_56
"latitude": -43.2075,
_56
"localized_description": "This is a localized_description",
_56
"localized_memo": "This is a localized_memo",
_56
"longitude": 139.691706,
_56
"member_guid": "MBR-3bdc7d6b-efd4-1497-a0af-b23501cf9bd0",
_56
"member_is_managed_by_user": false,
_56
"memo": "This is a memo",
_56
"merchant_category_code": 5411,
_56
"merchant_guid": "MCH-7ed79542-884d-2b1b-dd74-501c5cc9d25b",
_56
"merchant_location_guid": "MCL-00024e59-18b5-4d79-b879-2a7896726fea",
_56
"metadata": "some metadata",
_56
"original_description": "WHOLEFDS TSQ 102",
_56
"posted_at": "2016-10-07T06:00:00.000Z",
_56
"status": "POSTED",
_56
"top_level_category": "Food & Dining",
_56
"transacted_at": "2016-10-06T13:00:00.000Z",
_56
"type": "DEBIT",
_56
"updated_at": "2016-10-07T05:49:12.000Z",
_56
"user_guid": "USR-11141024-90b3-1bce-cac9-c06ced52ab4c",
_56
"user_id": "partner-2345"
_56
},
_56
// •••
_56
]
_56
}

Handling Member Connection Errors

The Connect Widget will automatically choose the best course of action for resolving a member connection status error.

All you need to do is recognize that error in your system, and load the connect widget with the affected member through the current_member_guid configurations.

See Member Connection Statuses for more info.

Browser Support

MX supports its widgets on the HTML 5-compliant browsers listed below. As of March 20, 2017, only browsers that support TLSv1.2 will be able to interact with MX products.

Supported Desktop Browsers

MX tests its web applications on the current and immediately preceding versions of the browsers listed in the following table. MX recommends using your browser’s auto-update feature to stay current on the latest version.

BrowserPCMac
ChromeYesYes
Microsoft EdgeYesN/A
FirefoxYesYes
SafariNoYes

Older Desktop Browsers

Older versions of the supported desktop browsers are not explicitly tested, but MX will attempt to review and address issues as they are reported. If a reasonable accommodation cannot be made, upgrading or switching to a supported browser may be recommended.

However, MX does not support any versions of Internet Explorer and will not address bugs or issues related to it.

Blocked Desktop Browsers

We want our partners and clients to have the best possible experience while using our products. Therefore, MX may actively block some browsers from displaying our products when the results would provide an extremely poor user experience.

Degrading browser performance by using alternate browser modes (such as Quirks or Compatibility modes) may prevent MX products from functioning properly.

Supported Mobile Browsers

MX tests its web applications on the current and immediately preceding versions of the iOS and Android operating systems. For each supported OS version, MX tests on both the current and immediately preceding versions of the browsers listed below. MX recommends using your browser’s auto-update feature to stay current on the latest version.

BrowseriOSAndroid
ChromeNoYes
SafariYesN/A
WKWebViewYesN/A
Android WebViewN/AYes

MX no longer supports UIWebView. Apple stopped recommending the use of UIWebView beginning with the release of iOS 8 in September 2014. It now recommends using WKWebView.

Older Mobile Browsers

Older versions of browsers listed above are not explicitly tested, but MX will attempt to review and address issues as they are reported. If a reasonable accommodation cannot be made, upgrading or switching to a supported browser may be recommended.

Minimum Dimensions and Breakpoints

The Connect Widget uses a responsive design. Page styles and layout are subject to change, and elements may become hidden or visible at different widths.

The following are the minimum dimensions supported for mobile and desktop platforms.

  • Minimum height: 550px
  • Minimum width: 320px

The following are the width breakpoints at which the design may change. These are based on typical industry device resolutions and are subject to change in the future.

  • Small: 320px to 767px
  • Medium: 768px to 1199px
  • Large: 1200px or greater

Language Support

Getting a widget in a specific language requires passing the desired language as a parameter in the Accept-Language header with requests to the Request Widget URL endpoint.

If no header is provided, the Connect Widget will default to en-US.

These languages are supported in the Connect Widget:

  • en-CA
  • en-US
  • es
  • fr

OAuth Support

MX can configure your Connect Widget to support OAuth institutions.

For institutions using an OAuth flow, the Connect Widget will redirect to that institution's page or mobile app, where the end user can authorize the accounts they want to connect.

For more information, see OAuth Flow.

Handling Session Timeouts

When integrating our Connect Widget, you’ll want to think about the session timeout built into the widget and the session timeout built into your website or mobile app.

The widget automatically times out after 15 minutes of inactivity. You can reach out to your account representative to customize this duration.

Thirty seconds before the timeout, a No recent activity screen appears and prompts the user to select Continue to avoid timing out. If no user activity is detected within those 30 seconds, the widget will timeout and display a Session expired screen.

Member Use Cases

note

You must work with MX to enable this functionality.

You can opt in to setting the use_cases field in applicable requests so each member has an associated use_case. This ensures only the data associated with the use case for that member (PFM or Money Movement) is returned. It also lets you filter a user’s data through a single use_case, even if data relating to a different use_case is in our system.

If you’ve implemented the Connect Widget and have worked with MX to enable member use cases, you must include the use_cases field when requesting your widget URL to ensure:

  • Each member is associated with a specific use case.
  • Our Personal Finance Management and Financial Insights products reflect data only for members with the PFM use case.
  • Members with "use_cases": ["MONEY_MOVEMENT"] do not aggregate transaction data.

In the Connect Widget, this change impacts the flow of new and existing members.

For more info about other changes relating to creating members, updating members, and available query parameters for use cases, see the Platform API docs.

New Members

When you request a widget URL with a widget_type of connect_widget or connections_widget, set the use_cases field. The use cases provided in this request will be saved to any member created inside of the widget.

For example, if you:

  1. Set use_cases: ["PFM"] in the widget URL request.
  2. Load the Connect Widget using the URL returned from the request.
  3. Successfully create a member.
  4. Read that member, which will have a use_case of PFM as set in step 1.

Existing Members

The widget won’t remove use cases from an existing member, it will only add new ones.

For example, let’s assume a member already exists that has use_cases: ["MONEY_MOVEMENT"]:

  1. You set use_cases: ["PFM"] in the widget URL request.
  2. The end user finds their institution and enters their same credentials as before.
  3. The widget will update the existing member so to have use_cases: [“MONEY_MOVEMENT”, "PFM"].

What's AllData Connect?

AllData Connect is a data source protocol that has the following benefits:

  • Enables access to financial institutions that host their data through Fiserv, enhancing stability and speed.
  • Provides secure, token-based connections that don't require credentials.

It mimics OAuth by navigating users to Fiserv’s connect experience in a new tab. After users consent to sharing data, Fiserv gives us a token and we redirect users back to our Connect Widget.

How's this different than OAuth?

OAuth is always API-based and navigates users to the institution's website.

AllData Connect isn't always API-based, navigates users to Fiserv's connect experience, and sends us a token after authentication.

info

Not every AllData Connect connection is API-based. For financial institutions that don't have an API, Fiserv will need to work with them to build one.