Error when adding card funding source using Dwolla-card.js

I am trying to add card funding source using Dwolla-card.js in React application, I followed steps mentioned in “Add a Debit Card Using Dwolla-cards.js | Dwolla API Documentation”.
I am able to generate “card-funding-sources-token” and pass it in the dwolla.cards.start function, I was able to view card form and a button, when I submit the form after filling all the neccessory details, it gives me below error.

Access to XMLHttpRequest at 'https://internal.sandbox-payments-api.com/applications/APnXFBb38RLNfcNQYZGETnh8/tokens' from origin 'https://forms.finixpymnts.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

application.js:11183 POST https://internal.sandbox-payments-api.com/applications/APnXFBb38RLNfcNQYZGETnh8/tokens net::ERR_FAILED

Hi @MayuriAdhikar

I may need to enable this feature for you. What is the email you used to setup your sandbox account?

@kmoreira I used “kadampriyanka1981@gmail.com

Hey @MayuriAdhikar

Looks like it was already enabled for you. Have you created a debit card for this customer before? You’ll get a CORs error when attempting to add a Debit card that already exists for a Customer. It’s something we have a ticket out for to fix this error handling.

For other errors that is triggered after submitting the form, you will need to handle the error or response which is triggered by the JavaScript callback. The callback function (err, res) allows you to determine if there is an error with the request (e.g. card expiration invalid) or if the response was successful.

You can find more info in this section of our cards guide.

Thanks @kmoreira, I was able to create the card, but when it hits the “funding-sources” api “https://api-sandbox.dwolla.com/funding-sources” with CardFingerprint, CardToken, and CardName as payload, it throws Invalid Access Token error as below:

{"code":"InvalidAccessToken","message":"Invalid access token."}

Hi @kmoreira , Did you get chance to look in this?

Hi @MayuriAdhikar

We’re looking into this. Are you re-using the card token when trying to access the card funding source in the API?

I tried creating new card funding source token, but the api gives me the same token every time.

Hi @MayuriAdhikar – are you perhaps using an idempotency-key header with your POST request to create a new card-funding-sources-token? If so, the requests are treated as duplicates and you’ll get the original response in the return. Try removing that header, or update the value to a new unique string in order to get a fresh unique Cards token.

Let us know if that’s not the case!

Hi, I am using dwolla client using dwolla-v2 to make requests.

Would you be able to share the raw req/res of your calls? Here’s our docs on idempotency-keys.

Hi @shreya ,
I followed below steps to add card using Dwolla-card.js:

  1. Created “card-funding-source-token” using dwolla customer Id, I am not passing any header at this time using this link - Add a Debit Card - Create a Card Funding Sources Token | Dwolla API Documentation
  2. Once I have the token, I call the dwolla.cards.start function from front end using the cdn script “https://cdn-b.dwolla.com/1/dwolla-cards.js”.
  3. When the card form opens, I add all the required details like “Card number”, “cvv”, “expiry” and other user details like address, then I click the submit button.
  4. When I click on the submit button, it gives me below details back and in the network, it gives me an error (2nd, 3rd and 4th image)

image

These are the payloads it takes (I am not making this call, it is made internally by index.js)

Hi @MayuriAdhikar

We tried recreating this error, and we can only get this error to occur when we reuse a card token to add a second card with it. Since it’s a one time use token, you need to make sure you’re generating a new token each time you create a new card.

Thanks a lot! @kmoreira, It worked for me.

2 Likes