Payment With Wallet
Overview
Payment With Wallet widget enables customers to make payments using their saved payment methods such as cards, bank accounts and Google Pay, or Apple Pay. It offers a user interface that allows customers to select their preferred payment method, set a default payment method, manage their wallet, and complete payments.
When to use it
Payment With Wallet widget is designed for customers can access and use their stored payment methods in wallet to complete transactions. It provides a convenient and consistent way for merchants to display saved payment methods during checkout or highlight a preferred option for future transactions. To render the widget, merchants need to provide a CCG customer identifier (e.g., hsid), a merchantTransactionId (which can be generated using a UUID library), the payment amount, and the configured mode of the CCG widget set to PAYMENT_WITH_WALLET.
Pre requisites
- Merchants are required to have an account on the CCG Platform and complete the technical integration process.
- After completing the onboarding process, merchants will receive a valid merchantId, which must be included in the header of all requests to CCG APIs, as outlined in the next section.
- Merchants must also obtain a valid JWT token for authentication purposes. This token should be included in the header of all request to CCG APIs, as outlined in the next section
Supported Experiences
Usage
Create a Session
- To create a session, send a request object specifying the customer details, configuration modes.
Example Request
Headers required:
- Authorization: Bearer xxxxx
- Content-Type: application/json
- X-Upstream-Env: stage (Specify the env value, Only required for Non-Prod)
- X-Merchant-Id: (MerchantId obtained during onboarding)
{
"payment": {
"amount": 1500,
"description": "Payment Description",
"merchantTransactionId": "e31de58d-cb20-40ff-ad58-b99d500z0001",
"authorizedCard": true,
"statementDescriptorSuffix": "AB1213",
"metaData": {
"orderId": "23178901",
"purpose": "Medicine Purchase"
}
},
"customer": {
"enterpriseId": "enterprise id",
"hsid": "hsid",
"firstName": "first name",
"lastName": "last name",
"email": "email",
"ssnLastFour": "1234",
"phoneNumber": {
"number": "1234567890",
"countryCode": "1"
},
"dateOfBirth": "dob",
"zip5": "23124",
"metadata": {
"patientId": "rx-patient-id"
}
},
"config": {
"modes": ["PAYMENT"],
"paymentMethodChannel": {
"card": [
"TEXT",
"EMAIL",
"WEBFORM",
"GOOGLE_PAY",
"APPLE_PAY",
"TELEPHONIC_ENTRY"
],
"bankAccount": [
"TEXT",
"EMAIL",
"WEBFORM"
]
}
},
"agent": {
"firstName": "First Name",
"lastName": "Last Name",
"userId": "msId",
"isAccessVerified": true
},
"consent": {
"merchantConsentText": "string",
"collectionTimestamp": "string",
"collectionDetails": {
"type": "WEB",
"web": {
"ipAddress": "string",
"userAgent": "string"
},
"tel": {
"inboundPhoneNumber": {
"countryCode": "string",
"number": "string"
}
}
}
}
}
More info
Note: Use hostedURL from the session response to launch the hosted experience.
Explanation on above Request Payload
- payment: Represents the payment object.
- amount: Defines the amount in cents
- description: A description of the payment.
- merchantTransactionId: Defines the unique transaction identifier for the payment transaction.
- authorizedCard: Indicates the card payment is authorized or not
- metadata: Represents the metadata object, which can include additional information about the payment; such as orderId, purpose etc.,.
- customer: Represents the customer object.
- A valid customer identifier (i.e., hsid or enterpriseId, rx-patientId etc.,) is must required for Payment with wallet widget in order to perform the payment using the stored payment methods in wallet.
- config.modes: Defines the mode of the CCG widget, which is set to PAYMENT_WITH_WALLET.
- PAYMENT_WITH_WALLET mode is default mode offered by CCG if customer was identified during session creation.
- config.paymentMethodChannel: Specifies the types of payment methods displayed on the customer's wallet screen when the session is created.
- config.paymentMethodChannel.card - Specifies the channels through which card payment method details can be captured. The available options are:
- TEXT: Captures card details via SMS.
- EMAIL: Captures card details via email.
- WEBFORM: Captures card details via web form.
- TELEPHONIC_ENTRY: Captures card details via telephonic entry.
- APPLE_PAY: Make a payment through APPLE_PAY.
- GOOGLE_PAY: Make a payment through GOOGLE_PAY
- config.paymentMethodChannel.bankAccount - Specifies the channels through which bank account payment method details can be captured. The available options are:
- TEXT: Captures bank account details via SMS.
- EMAIL: Captures bank account details via email.
- WEBFORM: Captures bank account details via web form.
- TEXT, EMAIL, and TELEPHONIC_ENTRY channels are available exclusively for agent-assisted sessions.
- WEBFORM channel is available for both agent-assisted and self-service sessions.
- WEBFORM channel is set to default to self-service sessions.
- APPLE_PAY, GOOGLE_PAY digital wallets are available exclusively for self-service sessions.
- Note: The channels specified in the request must be enabled during the onboarding process. If a channel is not enabled, it will not be available for use.
- config.paymentMethodChannel.card - Specifies the channels through which card payment method details can be captured. The available options are:
- agent: Applied for agent assisted sessions.
- Agents can select the payment method in wallet to perform the payment after they capture payment method details from customers through various channels, including TEXT, EMAIL, and TELEPHONIC_ENTRY.
- The agent must be part of the WS2 group (i.e., the AZU_PCI_Workstation_2 secure group) to capture card details from customers if the merchant has opted for ws2Check during onboarding as part of PCI compliance.
- consent: The consent object is mandatory to perform payments using a bank account.
- merchantConsentText: Defines the consentText to be displayed in the Widget. It is mandatory for both self-service and agent-assisted sessions.
- collectionDetails.type: Defines the type of collection details. The available options are:
- WEB: Represents the web collection details, applicable to only self-service sessions.
- TEL: Represents the telephonic collection details, applicable to only agent-assisted sessions.
- Note: Any one of the collection type must be provided along with its object
- collectionDetails.type.web: Represents the web collection details.
- ipAddress: Defines the IP address of the customer.
- userAgent: Defines the user agent of the customer.
- Note: collectionsDetails.type.web is applicable only for self-service sessions and can be captured by CCG widget while perform bank account payment
- collectionDetails.type.tel: Represents the telephonic collection details.
- inboundPhoneNumber: Defines the inbound phone number of the customer.
- countryCode: Defines the country code of the phone number.
- number: Defines the phone number of the customer.
- Note: collectionsDetails.type.tel is applicable only for agent-assisted sessions and can be provided by agent while creating the session to perform the bankAccount payment.
- inboundPhoneNumber: Defines the inbound phone number of the customer.
FAQs:
-
What is the PAYMENT_WITH_WALLET mode? The PAYMENT_WITH_WALLET mode enables customers to make payments using their saved payment methods, such as cards and bank accounts. It offers a user interface that allows customers to choose their preferred payment method, set a default option, manage their wallet, and complete payments.
-
What happens if there are no saved payment methods in the customer's wallet? If the customer's wallet contains no saved payment methods, the screen prompts them to manage their wallet and add a payment method.
-
When should I use the PAYMENT_WITH_WALLET mode? The PAYMENT_WITH_WALLET mode is well-suited for scenarios where customers need to access and utilize their saved payment methods to complete transactions. It provides merchants with a convenient way to display saved payment methods during checkout or emphasize a preferred option for future transactions.
-
What happens if the consent object for ACH is absent or invalid? If the consent object for ACH is missing, lacks the merchantConsentText property, or contains an invalid merchantConsentText value, the ACH authorization agreement section will not be displayed on the screen and won't allow to perform the bank account payment.
-
What happens if an invalid CCG customer identifier is used? If an invalid CCG customer identifier is provided, the session creation will fail and return a response stating that the customer identifier is missing.
-
What are the different integration patterns available for launching the PAYMENT_WITH_WALLET widget? The PAYMENT_WITH_WALLET widget can be launched in various forms of CCG’s integration patterns such as hosted, modal, inline, drawer, inline with modal, inline with drawer experiences.
-
What happens if I add a card that is already in my wallet? If a user adds a card that is already present in the wallet, the fields "Name on Card," "Expiration Date," "Nickname," and "Zip Code" are updated in the existing card.
-
What happens if I add a bank account that is already in my wallet? If a user adds a bank account that already exists in the wallet, the fields "Account Type," "Name on Account," and "Bank Account Nickname" are updated in the existing bank account.