Next, you’ll create a custom HTML container that the drop-in component will render in on page load. A drop-in component will be rendered when the dwolla-web.js library is initialized using dwolla.configure() (referenced below).
Configuration of the dwolla object includes: your generated client-token, environment, optional styles, along with success and error overrides.
sandbox
or production
<script>
dwolla.configure({
environment: "sandbox",
styles: "/styles/update-custom.css",
tokenUrl: () => Promise.resolve("/token-endpoint"),
success: (res) => Promise.resolve(res),
error: (err) => Promise.resolve(err),
});
</script>
Dwolla provides a list of CSS classes available for styling certain elements of the component. These elements can be customized to match the look and feel of your application and are styled by passing in a custom stylesheet when configuring the dwolla-web client library. By default, the elements within your specified container are responsive to any change in screen size. For a full list of supported CSS classes available for each component, view our Concept article.
It's important to note that with the exception of a “Create a Customer” component like the one found below, all components require a Customer ID to be passed into a customerId
element in order to initialize the component. This Customer ID should come from your back-end server when generating a client-token for an end-user/Customer and can optionally be stored in a session or cookie.
<div class="customer">
<dwolla-business-vcr terms="www.yourterms.com" privacy="www.yourprivacy.com">
</dwolla-business-vcr>
</div>
When loading the page containing the component, you should see the following:
Upon submission of form components, a user facing message will be displayed to the end user on success or error. These user facing messages can be styled via custom div and span CSS classes corresponding to:
dwolla-success
and dwolla-success-message
dwolla-error
and dwolla-error-message
On ‘success’ the creation of a new resource will result in a JSON response that’s returned with a location
key:value pair including a link to the created resource. For example:
{ location: https://api.dwolla.com/documents/{id} }
Updates to an existing resource will result in the actual JSON response which corresponds to the action that occurred.
Use sandbox environment to test API requests.
Dwolla, Inc. is the operator of a software platform that communicates user instructions for funds transfers to our financial institution partners.
Dwolla is an agent of Veridian Credit Union. All ACH and Wire transfers are performed by Veridian Credit Union. Your Dwolla Balance, if any, is held in one or more pooled holding accounts held by Veridian Credit Union. These funds may not be eligible for share insurance by the National Credit Union Share Insurance Fund.
Sponsorship and Settlement of Push-to-Debit payment services provided by MetaBank®, N.A.
Push-to-Debit payments are typically available within 30 minutes.
Real-Time Payments are performed by Cross River Bank, which holds funds on behalf of the Receiver of such transactions in one or more pooled custodial accounts. These funds are not subject to FDIC pass-through deposit insurance.