In this blog post you will learn the Solution approach and steps to be followed while integrating the Hybris commerce backoffice to other applications using web services.
Introduction : As we all know the Hybris Backoffice Framework provides rich UI building components called Widgets, with which we can wire together to build our own Cockpit. Widgets are flexible and easy to customize. Angular widget also inherits these characteristics as we can bring in almost every feature that angular js supports in our backoffice widgets as well. One such angular feature that can be incorporated is firing and consuming web services with external applications (SAP or Non-SAP) using the angular widgets of SAP Hybris Commerce backoffice.
Business use case: In SAP Hybris Commerce backoffice merchant wants to view the financial receivables from the customer and payable to the vendors though display report displayed in SAP Hybris Commerce calling required data from backend ECC using web services.
Solution Approach
Steps required from Hybris side are explained below.
Account payable
Account receivables
Conclusion : SAP Hybris Commerce is proved to be one of the best in class but we very often stumble upon situations where we would need to integrate SAP Hybris commerce with third party application. Though, SAP Hybris Commerce comes with wide variety of handy integration mechanisms like datahub and hot folders, we may also require web services as a medium as well. In terms of SAP Hybris Commerce backoffice this can be achieved by making use of Angular widget of SAP Hybris Commerce backoffice framework.
Introduction : As we all know the Hybris Backoffice Framework provides rich UI building components called Widgets, with which we can wire together to build our own Cockpit. Widgets are flexible and easy to customize. Angular widget also inherits these characteristics as we can bring in almost every feature that angular js supports in our backoffice widgets as well. One such angular feature that can be incorporated is firing and consuming web services with external applications (SAP or Non-SAP) using the angular widgets of SAP Hybris Commerce backoffice.
Business use case: In SAP Hybris Commerce backoffice merchant wants to view the financial receivables from the customer and payable to the vendors though display report displayed in SAP Hybris Commerce calling required data from backend ECC using web services.
Solution Approach
- Backend SAP ECC side: New RFC module required to provide payable / receivable details such as Posting Date, Clearing Date, Status of Payment whether due, over-due, not-due or paid, purchase/sales order and so on upon receiving the Vendor Account IDs / Customer Account IDs respectively.
- Hybris commerce side:
Steps required from Hybris side are explained below.
- Creating angular widget in backoffice extension.
- Creating angular widget is simple, and is same as normal widget which contain ZUL file.
- Making extension to use Angular Library, so that any angular widgets in the extension will be registered.
- Create a widget definition file, which would point to HTML page which contain the page that need to be displayed in backoffice.
- Create a javascript file which contain logic to make a webservice call.
- Create a CSS file which will be reflected in HTML page.
- Create a link in backoffice explorer tree, which will be used to open the angular widget.
Account payable
Account receivables
Conclusion : SAP Hybris Commerce is proved to be one of the best in class but we very often stumble upon situations where we would need to integrate SAP Hybris commerce with third party application. Though, SAP Hybris Commerce comes with wide variety of handy integration mechanisms like datahub and hot folders, we may also require web services as a medium as well. In terms of SAP Hybris Commerce backoffice this can be achieved by making use of Angular widget of SAP Hybris Commerce backoffice framework.
- SAP Managed Tags:
