JavaScript SDK Smart Buttons Guest Checkout users must enter card information twice

JoePerkins
Contributor
Contributor

When using Smart buttons from the JavaScript SDK and during guest checkout the user is required to enter card information twice.

Sets to reproduce, using the PayPal online example: https://developer.paypal.com/demo/checkout/#/pattern/client

 

  1. Click the PayPal (yellow pay now) button and then the new PayPal window opens.
  2. Click the gray "Pay with Debit or Credit Card", this navigates to the "PayPal Guest Checkout" page.
    (https://www.sandbox.paypal.com/checkoutweb/signup?...)
  3. Enter billing and card information and click "Continue", this navigates to a new "PayPal Guest Checkout" page after a very long wait.
    (https://www.sandbox.paypal.com/webapps/xoonboarding?...)
  4. The user must again billing and card information and click "Pay Now" and completes successfully. 

I have deployed a similar staging implementation and have the same results, how do I prevent the need for the user to enter the exact same information twice?  

 

I've tried setting the application_context user_action below as documented but results in a PayPal 400 server error when clicking the Smart Button.

JoePerkins_0-1612373477431.png

 

application_context: {
                        shipping_preference: 'NO_SHIPPING',
                        user_action: "commit"
                    }

Payments (paypal.com)

application_context

  • brand_name

    string

    A label that overrides the business name in the merchant's PayPal account on the PayPal checkout pages.

    Maximum length: 127.

  • locale

    string

    The locale of pages that the PayPal payment experience displays. Please refer here for list of supported local codes. Defaulted to en_US if not provided or invalid.

  • landing_page

    string

    The type of landing page to show on the PayPal site for customer checkout. To use the non-PayPal account landing page, set to Billing. To use the PayPal account log in landing page, set to Login.

  • shipping_preference

    enum

    The shipping preference.

    The possible values are:

    • NO_SHIPPING. Redacts the shipping address from the PayPal pages. Recommended for digital goods.
    • GET_FROM_FILE. Uses the customer-selected shipping address on PayPal pages.
    • SET_PROVIDED_ADDRESS. If available, uses the merchant-provided shipping address, which the customer cannot change on the PayPal pages. If the merchant does not provide an address, the customer can enter the address on PayPal pages.
  • user_action

    string

    The user action. Presents the customer with either the Continue or Pay Now checkout flow:

    FlowActionDescriptionPay Nowuser_action=commitAfter the customer is redirected to the PayPal payment page, shows the Pay Now button.

    Use this option when you know the final amount when checkout is initiated and you want to process the payment immediately when the customer clicks Pay Now.
    Continue user_action=continue After the customer is redirected to the PayPal payment page, shows the Continue button.

    Use this option when you do not know the final amount when you initiate the checkout flow and you want to redirect the customer to the merchant page without processing the payment.
  • preferred_payment_source

    object

    The preferred payment source for the payer. Currently supported only for PayPal Billing Agreements. If provided, checkout experience will have this payment source pre-selected for the 

Login to Me Too
4 REPLIES 4

csmmaster
Contributor
Contributor

I'm currently having the same problem and the demo page is also still doing it.

Did this ever get resolved?

 

Update:

Tested this in production and it works fine. Problems appears to happen only in the sandbox.

Login to Me Too

csmmaster
Contributor
Contributor

This problem turned out to be the card number. I was using 4111 1111 1111 1111.

Full disclosure: My problem was not with PayFlow but with the In-Context Express Checkout. Yet, it manifested exactly the same way.

 

Using the example: https://developer.paypal.com/demo/checkout/#/pattern/client

  1. Clicked PayPal button.
  2. Clicked Pay with Debit or Credit Card.
    Checkout window loaded with: "https://www.sandbox.paypal.com/checkoutweb/signup?buttonSessionID=..."
    for input of card number, expiration, and CVV as well as billing address. Billing address includes first and last name.
  3. Entered card number 4111 1111 1111 1111 and remainder of inputs with any valid data.
  4. Clicked Continue.
    Checkout window is loaded with: "https://www.sandbox.paypal.com/webapps/xoonboarding?buttonSessionID=...".
    This is a slightly different card info input page with the first and last name part of the card credentials instead of the billing address.
  5. Entered card number 4111 1111 1111 1111, again, along with valid data for the other inputs.
  6. Clicked Pay Now.
  7. Payment was successful.

 

Using my In-Context Express Checkout, there was no difference except for the query string parameters of the checkout window URLs.

After step 2, the checkout window was loaded with "https://www.sandbox.paypal.com/checkoutnow?token=..."

After step 4, the checkout window was loaded with "https://www.sandbox.paypal.com/webapps/xoonboarding?token=..."


In both cases, checkout succeeded, without loading the 2nd card input page, if I used a card number created by the Credit Card Generator in my PayPal Developer Dashboard. Only the card number was required using the expiration date and CVV from the card generator did not matter. Any valid values would suffice.


I hope this helps somebody avoid the time-consuming, hair tearing-out, process I went through trying to find help and track down the solution to this problem. Certainly, it would have been more useful to have some kind of error rather than the load of a second input page. But, barring that, try choosing a different card number.

 

Update:

 

I have confirmed using 4111 1111 1111 1111 for the card number, in production, works the same way. The second payment fields input page is loaded after completing the input in the first page and clicking "Continue". Clicking "Pay Now" in the second page responds with the message "We weren't able to add this card...".

 

However, using a card number created using the Card Number Generator (not a valid number in production), the process works correctly, showing the error message after clicking "Continue" on the first page. The second page is never loaded.

 

 

Login to Me Too

privateskin
New Community Member

I opened an online store for Private label skincare cosmetics manufacturer. I have many customers who are using  paypal as their payment method. I need to know if you guys allow papal to be integrated into sites for payment. My site is a product based e-commerce store. I need to know how to do it as well!

Login to Me Too

Shiva16
New Community Member

I am a digital goods store owner who has been selling on the internet for years. My company's name is Digitalaccs, and we have many customers using payment methods like Paypal due to their ease of use! I need help integrating Papal so that you can buy from us just as easily online or in person at our physical storefront location nearby if needed.

Login to Me Too

Haven't Found your Answer?

It happens. Hit the "Login to Ask the community" button to create a question for the PayPal community.