Fastlane reference

DocsCurrent

Last updated: Feb 6th, 9:42am

Troubleshoot, read our FAQs, follow best practices, and customize your integration.

Troubleshooting

The following are common issues and steps to take to resolve them.

Authorization error while initializing Fastlane

This error indicates that your merchant account and your client credentials may not be fully provisioned for Fastlane. Talk to your account team for assistance.

Fastlane member doesn't have cards or addresses

Add a new card or address to the member's Fastlane profile. Complete the order. The payment should be completed successfully with the new card.

No payment token returned

If FastlaneCardComponent.getPaymentToken() doesn't return a token, ensure that you're passing all required parameters in the correct format.

Undefined methods returned

Fastlane has been disabled from within the PayPal dashboard if the identity.triggerAuthenticationFlow(), profile.showShippingAddressSelector(), or profile.showCardSelector() methods return undefined.

If the merchant has disabled Fastlane, the Fastlane client SDK reverts to the guest experience without the ability to opt-in to creating a Fastlane profile. This ensures there is no interruption to your buyers.

FAQs

Will Fastlane work if I save a payer's payment methods to the PayPal vault?

Yes, the paymentToken returned on the client can be saved to the vault. You can vault the paymentToken before transacting or transact before vaulting. PayPal only supports vaulting when using the store_in_vault attribute of the create order request.

Fastlane does not support a flow where a customer or payment_method is created prior to a transaction.

How long is a payment token valid?

A paymentToken is valid for 3 hours from the time of issuance.

What if the payer's shipping address is in a location that my site does not ship to?

When you initially call window.paypal.fastlane.create(), you have the option of passing in a list of allowed locations using the addressOptions object.

How should I handle when a payer leaves the checkout page?

Sometimes the payer navigates away from the checkout page to add or remove items. Call the triggerAuthenticationFlow() method every time the checkout page is reloaded. There is internal logic within our SDK that determines whether we require the payer to authenticate via OTP again or restore the session. In either case, the method returns the authenticatedCustomerResult. This also includes a new paymentToken.

I am located outside the US. How can I test Fastlane?

Fastlane is only available to payers in the US. If you are located outside of the US, you need to use a VPN when testing in order to test the payer flows.

Does a Fastlane member have to authenticate with an OTP for every transaction?

A Fastlane member who has authenticated on their device won't receive an OTP for other transactions with the same merchant during the same session. After the session expires, the member must re-authenticate.

Does Fastlane support transactions through MOTO or manual entry?

Currently, Fastlane does not support mail order/telephone order (MOTO) or manual entry transactions.

Best practices


Customize your integration

Use the following configuration parameters, profile method reference types, and style options to customize your Fastlane integration.

Configuration parameters

window.paypal.Fastlane(options);

    1interfaceFastlaneOptions{
    2shippingAddressOptions:AddressOptions,
    3cardOptions:CardOptions,
    4styles:StyleOptions
    5}
    6/*
    7 * To restrict the use of Fastlane to specific countries or regions, set
    8 * allowedLocations to an array containing the countries or regions where Fastlane
    9 * should be allowed.
    10 *
    11 * To allow all regions within a particular country, specify only the country's
    12 * ISO 3166-1 alpha-2 country code.
    13 *
    14 * To allow only specific regions in a country, specify the country's
    15 * ISO 3166-1 alpha-2 country code, followed by a colon (":"), followed by the
    16 * name of the region.
    17 *
    18 * Examples:
    19 * - [ "US" ] = Allow all regions within the United States
    20 * - [ "US:CA", "US:AZ" ] = Allow in California in Arizona, but nowhere else
    21 * - [ "US:CA", "US:AZ", "FR" ] = Allow in California, Arizona, and France,
    22 * but nowhere else
    23 */
    24interfaceAddressOptions{
    25// default: empty array = all locations allowed
    26allowedLocations:[AddressLocationEnum];
    27}
    28EnumAddressLocationEnum{
    29{
    30ISO- country - code
    31}{
    32ISO- country - code
    33}:{
    34ISO- region - code
    35}
    36}
    37interfaceCardOptions{
    38// default: empty array = all brands allowed
    39allowedBrands:[CardBrandEnum];
    40}
    41EnumCardBrandEnum{
    42VISA
    43MASTERCARD
    44AMEX
    45DINERS
    46DISCOVER
    47JCB
    48CHINA_UNION_PAY
    49MAESTRO
    50ELO
    51MIR
    52HIPER
    53HIPERCARD
    54}
      1type create=(options:FastlaneOptions)=>Fastlane;

      Fastlane namespace

        1interface Fastlane {
        2 identity {
        3 lookupCustomerByEmail: (email: string) => LookupCustomerResult,
        4 triggerAuthenticationFlow: (customerContextId: string, options: AuthenticationFlowOptions) => AuthenticatedCustomerResult
        5 }
        6 profile {
        7 showShippingAddressSelector: () => ShowShippingAddressSelectorResult,
        8 showCardSelector: () => ShowCardSelectorResult,
        9 }
        10 setLocale: (locale: string) => void, // options: en_us, es_us, fr_us, zh_us
        11 FastlaneCardComponent: (options: FastlaneCardComponentOptions) => FastlaneCardComponent,
        12 FastlanePaymentComponent: (options: FastlanePaymentComponentOptions) => FastlanePaymentComponent,
        13 FastlaneWatermarkComponent: (options: FastlaneWatermarkOptions) => FastlaneWatermarkComponent
        14}
        LookupCustomerResult

        The LookupCustomerResult object type is returned from the identity.lookupCustomerByEmail(email) method.

          1interface LookupCustomerResult {
          2 customerContextId: string
          3}

          FastlaneWatermarkComponent

            1interface FastlaneWatermarkOptions {
            2 includeAdditionalInfo: boolean
            3}
            4interface FastlaneWatermarkComponent {
            5 render: (container) => null
            6}
            AuthenticatedCustomerResult

            The AuthenticatedCustomerResult object type is returned from the identity.triggerAuthenticationFlow() call

              1interface AuthenticatedCustomerResult {
              2 authenticationState: 'succeeded' | 'failed' | 'canceled' | 'not_found';
              3 profileData: ProfileData;
              4}
              5interface ProfileData {
              6 name: Name;
              7 shippingAddress: Shipping;
              8 card: PaymentToken;
              9}
              10interface Name = {
              11 firstName: string;
              12 lastName: string;
              13 fullName: string;
              14};
              15interface Phone = {
              16 nationalNumber: string;
              17 countryCode: string;
              18};
              19interface Address = {
              20 addressLine1: string,
              21 addressLine2: string,
              22 adminArea1: string,
              23 adminArea2: string;
              24 postalCode: string,
              25 countryCode: string
              26 phone: Phone;
              27};
              28interface Shipping = {
              29 name: Name;
              30 address: Address;
              31 companyName: string;
              32}
              33interface BillingAddress = Address;
              34interface PaymentToken {
              35 id: string; // This is the payment paymentToken
              36 paymentSource: PaymentSource;
              37}
              38interface PaymentSource {
              39 card: CardPaymentSource;
              40}
              41interface CardPaymentSource {
              42 brand: string;
              43 expiry: string; // "YYYY-MM"
              44 lastDigits: string; // "1111"
              45 name: string;
              46 billingAddress: Address;
              47}

              Profile method reference types

                1interface ShowShippingAddressSelectorResult {
                2 selectionChanged: boolean;
                3 selectedAddress: Address;
                4}
                5interface ShowCardSelectorResult {
                6 selectionChanged: boolean;
                7 selectedCard: PaymentToken;
                8}
                FastlaneCardComponent

                The FastlaneCardComponent uses hosted card fields. The resulting interface is a subset of the card fields interface.

                The instance of a FastlaneCardComponent can be created using

                  1const fastlaneCardComponent = await fastlane.FastlaneCardComponent({
                  2 ...
                  3})
                  4fastlaneCardComponent.render("#card-container")

                  FastlaneCardComponent reference types:

                    1type FastlaneCardComponent = (options: FastlaneCardComponentOptions) => FastlaneCardComponent;
                    2interface FastlaneCardComponent {
                    3 render: (container) => FastlaneCardComponent;
                    4 getPaymentToken: async (options: PaymentTokenOptions) => PaymentToken;
                    5}
                    6interface FastlaneCardComponentOptions {
                    7 styles: StyleOptions;
                    8 fields: {
                    9 Field
                    10 };
                    11}
                    12interface Field {
                    13 placeholder: string;
                    14 prefill: string;
                    15 enabled: boolean;
                    16}
                    17interface PaymentTokenOptions {
                    18 billingAddress: Address;
                    19 cardholderName: Name;
                    20}
                    Card field configurations

                    You can configure the card fields in the FastlaneCardComponent or FastlanePaymentComponent when initializing the components:

                      1const styles: {};
                      2const fields: {
                      3 number: {
                      4 placeholder: "Number",
                      5 },
                      6 phoneNumber: {
                      7 prefill: "555-555-5555"
                      8 }
                      9}
                      10}
                      11
                      12fastlane.FastlaneCardComponent({
                      13 styles,
                      14 fields
                      15}).render(elem);
                      16fastlane.FastlanePaymentComponent({
                      17 styles,
                      18 fields
                      19}).render(elem);

                      You can prefill both FastlaneCardComponent and FastlanePaymentComponent.

                      See available card fields

                      Name Type Attributes Description
                      number field <optional> A field for the card number.
                      expirationDate field <optional> A field for expiration date in MM/YYYY or MM/YY format. This should not be used with the expirationMonth and expirationYear properties.
                      expirationMonth field <optional> A field for expiration month in MM format. This should be used with the expirationYear property.
                      expirationYear field <optional> A field for expiration year in YYYY or YY format. This should be used with the expirationMonth property.
                      cvv field <optional> A field for 3 or 4-digit card verification code (like CVV or CID). If you wish to create a CVV-only payment token to verify a card already stored in your vault, omit all other fields to only collect CVV.
                      postalCode field <optional> A field for the postal or region code.
                      cardholderName field <optional> A field for the cardholder name on the payer's credit card.
                      phoneNumber field <optional> A field for the cardholder name on the payer's credit card.

                      Style options and guidelines

                      Colors can be any value that CSS allows in hex values, RGB, RGBA, and color names.

                        1interface StyleOptions {
                        2 root: {
                        3 backgroundColor: string,
                        4 errorColor: string,
                        5 fontFamily: string,
                        6 textColorBase: string,
                        7 fontSizeBase: string,
                        8 padding: string,
                        9 primaryColor: string,
                        10 },
                        11 input: {
                        12 backgroundColor: string,
                        13 borderRadius: string,
                        14 borderColor: string,
                        15 borderWidth: string,
                        16 textColorBase: string,
                        17 focusBorderColor: string,
                        18 },
                        19}
                        Design guidance

                        When styling the Fastlane components to match the look and feel of your checkout page, here are some guidelines to provide an accessible and transparent experience to your payer:

                        • Ensure that there is adequate contrast between the backgroundColor and textColor to ensure that all text, especially the legal text under the opt-in, is clear and legible. If the contrast ratio between the two is not 4.5:1, PayPal automatically sets the contrast to the default values in the following table.
                        • Ensure there is adequate contrast between the borderColor, which drives the consent toggle coloring, and the backgroundColor.

                        Payment component UI

                        See payment component UI values

                        See also

                        Related documentation:

                        Required

                        Integrate Fastlane

                        Use our ready-made quickstart integration or customize form fields with our flexible integration.

                        Required

                        Upgrade to Fastlane

                        Upgrade existing PayPal and card integrations to use Fastlane.

                        Required

                        Get started

                        Set up your development environment to integrate Fastlane.

                        If you accept cookies, we’ll use them to improve and customize your experience and enable our partners to show you personalized PayPal ads when you visit other sites. Manage cookies and learn more