SAP Open Payment Framework (OPF) Accelerator Add-o...

SandipanDas

Scope:

Use of Accelerator Add-on SDK to integrate SAP Commerce Cloud, Open Payment Framework with legacy accelerator-based storefronts, both B2C & B2B.
Accelerator Add-on SDK can be shipped/delivered to customers in a standalone mode so that implementation partners/customers can apply these addons to their existing storefront application with minimal customization/configurations to replace the legacy payment integration approach and use the OPF based payment providers.
Customers need to perform an implementation of the addon on their storefronts which shall mostly be configuration and testing effort to replace the existing payment flows via custom developments.
A new checkout flow has been introduced for the OPF integration such that A/B testing shall be possible to validate the new OPF integration in terms of payment authorization/capture and order placement.
New PSPs can be configured through the OPF Workbench. If the PSP already has a connector, use it out-of-the-box. If not, build a custom adapter. The Commerce Core remains unaffected during this process.
Functionalities
- B2C:
  - Checkout payment types: Hosted fields, IFrame and Hosted page
  - CTA Scripts: PDP, Cart and Order confirmation
  - Quick Buy
- B2B:
  - Checkout payment types: Account payment & Card payment
  - CTA Scripts: Not available
  - Quick Buy: Not available

Prerequisites:

SAP Commerce Cloud V2 (2211.36 or higher)
OPF tenant activation
Credentials to connect with OPF tenant
Onboarding guide Link

Repository:

OPF Accelerator Add-on SDK repository link GitHub Link.

opfacceleratoraddon: B2C addon
opfb2bacceleratoraddon: B2B addon
opfacceleratorcore: Core extension

Architecture:

The difference b/w OPF integration with Composable storefronts and Accelerator storefront is accelerator storefronts directly connects with OPF APIs and composable storefronts connects with commerce cloud adapter APIs which in turns connects with OPF APIs

Install Steps - B2C Accelerator:

Install the addon using below command

ant addoninstall -Daddonnames="opfacceleratoraddon" -DaddonStorefront.yacceleratorstorefront="<your storefront extension name>"

The above command shall modify the project.properties file of the opfacceleratoraddon extension to include the below property

<yourcustomstorefront>.additionalWebSpringConfigs.opfacceleratoraddon=classpath\:/opfacceleratoraddon/web/spring/opfb2bacceleratoraddon-web-spring.xml,classpath\:/opfacceleratoraddon/web/spring/multi-step-checkout-config.xml

Enable OPF on the basestore by adjusting the store and site id and running the impex

opfacceleratoraddon/resources/opfacceleratoraddon/impex/opf.impex

Create the folder named as security in the config folder , create txt files containing client_id and secret for ccadapter and contains client_id and secret for OPF payment gateway.(Note: the filenames created here should be defined in the ccAdapter.oauth.client-secret.file and opf.oauth.client-secret.file)
Add below tenant configs in the hcs_commons since urls are not part of the code

ccAdapter.api.url - Base URL of your OPF cloud connector
ccAdapter.oauth.client-secret.file - ccadapter txt file name from step 4
ccAdapter.oauth.token.url - Token URL for cloud adapter
opf.base.url - OPF tenant base URL
opf.oauth.client-secret.file - Filenames created on step 4
opf.oauth.client-secret.file.location - ${HYBRIS_CONFIG_DIR}/security
opf.oauth.token.url - Token URL for OPF

CTA Script(Like Klarna) rendering on Cart and PDP: Add the following to your custom storefront extension

cartPage.jsp: opfacceleratoraddon/acceleratoraddon/web/webroot/WEB-INF/tags/responsive/cart/opfCartCTAScript.tag
productDetailsPanel.jsp: opfacceleratoraddon/acceleratoraddon/web/webroot/WEB-INF/tags/responsive/product/opfProductCTAScript.tag in productDetailsPanel.jsp

CTA Script(Like Klarna) rendering on Order Confirmation page: Refer to LINK
QuickBuy(GooglePay) integration: Add opfQuickBuy.tag in checkoutDisplay.jsp ( in your custom storefront extension)

Install Steps - B2B Accelerator:

For the B2B Accelerator storefront, the OPF integration is applicable only on the checkout steps. CTA scripting on product, cart and order confirmation pages are not included as part of this sample integration. You will need to customize these if necessary for your project.Install the addon using below command

ant addoninstall -Daddonnames="opfb2bacceleratoraddon" -DaddonStorefront.yacceleratorstorefront="<your storefront extension name>"

The above command shall modify the project.properties file of the opfacceleratoraddon extension to include the below property

<yourcustomstorefront>.additionalWebSpringConfigs.opfb2bacceleratoraddon=classpath\:/opfb2bacceleratoraddon/web/spring/opfb2bacceleratoraddon-web-spring.xml,classpath\:/opfb2bacceleratoraddon/web/spring/multi-step-checkout-config.xml

Enable OPF on the basestore by adjusting the store and site id and running the impex

opfb2bacceleratoraddon/resources/opfb2bacceleratoraddon/impex/b2bopf.impex

Follow the same steps 4 & 5 from B2C Accelerator install to configure the credentials and the URLs

Install - OPF order process (SAP OMS or Async order management): Both for B2C & B2B, refer to this link

Install - OPF return process : Both for B2C & B2B, refer to this link

Tax and shipping tax prices: Both for B2C & B2B, modify the following class based on your requirement

customization /custom/opfacceleratorcore/src/de/hybris/platform/populator/OPFPaymentOrderPopulator.java
populateOrderLines()
line.setLineDiscount(0.0); //Set Line discount
line.setLineShFeeTax(0.0); //Set line item shipping fee tax
line.setLineShFeeTaxPercent(0.0); //Set line item shipping fee tax percentage
line.setLineTaxPercent(0.0); //Set line item tax percentage
line.setLineTax(0.0); //Set line item tax

populateOrderDetails()
order.setShFeeWithTax(0.0); //Set shipping fee with tax according to custom implementation
order.setShFeeTax(0.0); //Set shipping fee tax

populateShippingMethod()
shippingMethodData.setShFeeTax(0.0); // Set shipping method shipping fee tax
shippingMethodData.setShFeeWithTax(0.0); //Set shipping method shipping fee with tax
shippingMethodData.setShFeeTaxPercent(0.0); //Set shipping method shipping fee tax percentage

Note:

PaymentTransactionModel will be created with minimum details. Please adjust based on your requirement.
PaymentTransactionEntryModel will be created via Commerce inbound integration and for this, commerce cloud adapter credentials are required as mentioned in the installation steps.

Main advantages of OPF over traditional payment integration approaches:

Low-code/No-code Configuration: Eliminates need for custom Java code development and reduces deployment cycles from weeks to days
No Core Commerce Changes: Payment integration changes don't require SAP Commerce code modifications or redeployments
Centralized Management: Single workbench UI for managing multiple PSPs, payment flows, rules, and configurations
SaaS Compliance: SAP manages PCI-DSS, PSD2, and 3-DS compliance, eliminating audit burden from your team
Rapid Integration: New PSP can be integrated in 2-3 days vs. weeks/months with traditional extensions
Version Independence: Updates to payment configurations don't require Commerce platform upgrades

Important Links

B2C Integration Screenshots:

Cart: Quick Buy

Checkout

B2B Integration Screenshots:

Checkout

Conclusion

Integrate the open payment framework(OPF) with SAP Commerce Cloud to initiate collaboration with payment service providers (PSPs) for your online stores. With the OPF Accelerator Add-on SDK, you can use OPF integrations on legacy accelerator based storefronts quickly, mostly through configuration. Use the steps above to install, configure add optional CTA and Quick Buy experiences.

SAP Open Payment Framework (OPF) Accelerator Add-on SDK Integration with Accelerator Storefronts