Setting Up the SAP Hybris Connector

Before you begin

To ensure your SAP Hybris Connector setup goes smoothly, make sure you have:

• Administrator-level access to SAP Hybris Backoffice
• A running instance of SAP Hybris Commerce Suite with version 6.4 or higher
• Access to the SAP Hybris OCC docs. (You will need an account to access the docs.)

SAP Hybris fundamentals

Before diving in, you should brush up on the SAP Hybris OCC APIs. If you know nothing about the OCC APIs, you should at least know this:

• SAP Hybris has an API that covers common shopper interactions, called Omni Commerce Connector (OCC) API.
• OCC is a RESTful HTTP API which uses OAuth2.
• HybrisConnector is built using the hybris-occ-client.
• Under the hood, OCC uses the Java Spring framework and can be heavily customized.

Basic URLs look like this:

Copy
https://$DOMAIN/rest/v2/$SITE/$ENDPOINT
https://www.example.com/rest/v2/apparel-uk/catalogs/

OAuth requests look like this:

Copy
curl https://hybris.merlinspotions.com/authorizationserver/oauth/token -X POST -d 'client_id=mobile_android&client_secret=secret&grant_type=client_credentials'

Once you have the access token, you can send it.

This is just the start. To learn more, we recommend reviewing the OCC docs. (You will need to login to your SAP account to access the docs.)

Installing the Mobify Webservice Extension

To simplify integration, we provide the Mobify Webservice Extension for SAP Hybris Commerce Suite. The extension modifies your SAP Hybris Webservice to provide additional functionality for your PWA. For example, it enables your PWA’s guest users to change their email address, and also supports storing additional information, such as phone numbers.

Installing the extension

1. Download and unzip the Mobify extension to your SAP Hybris file system: /hybris/bin/custom/PROJECT_NAME

2. In /hybris/bin/custom/PROJECT_NAME, you will find four Mobify extension folders. In your server-side rendered project, you will only be using the mobifywebservices addon.

3. Add the following lines to localextensions.xml:

Copy
<!--Mobify Extensions-->
<extension name="mobifywebservices" />

4. Next, run ant clean all in your command line tool.
5. Start the server for your Hybris instance. For example, we start the server for our Hybris instance by executing the following commands:
   • Unix: ./hybrisserver.sh
   • Windows: hybrisserver.bat
6. After starting the server, open a browser and navigate to your Hybris Administration Console, then login. (Note that the Hybris Administration Console is a different site than your SAP Backoffice.)
7. Once you’re logged in, click on Platform on the top menu, and then Update in the dropdown items. On the Update page, select the following options under the General settings heading:
   • Update running system
   • Clear the hMC configuration from the database
   • Localize types

At the bottom of the page, click on update. This will apply the changes to Hybris Backoffice.

Verifying your extension installed successfully

1. In your browser, navigate to your Hybris Administration Console and login. (Note that this is a different site than your SAP Backoffice.)
2. Once you’re logged in, click on Platform on the top menu, and then Extensions in the dropdown items.
3. Locate the search tool and enter the keyword “mobify”.
4. mobifywebservices will be listed in your extensions if you’ve installed it correctly.

Making your API available to the connector

1. Login to your SAP Hybris Backoffice.
2. On the left side navigation panel, choose System, then select OAuth, and choose OAuth Clients.
3. Click the + button.
4. In the pop-up box, enter the OAuth client ID and Client Secret.
5. Click Next, and you’ll skip to the Basic page.
6. On the Basic page, find Authorities and click the + button.
7. In the text field that appears, enter ROLE_CLIENT, then Add.
8. Find Client Grant Types and click the + button.
9. In the text field that appears, enter three separate entries: client_credentials, refresh_token, and password. Click Add for each.
10. Click Next, which will skip you to the Scopes page.
11. On the Scopes page, enter the scope of your oauth client. For example, we would enter “merlinspotions” for our demo.
12. Click Done.

Configuring your SAP Hybris instance

When your project gets generated, you get a starting point SAP Hybris connector, which you will be replacing.

To configure and instantiate your instance of the SAP Hybris connector:

1. Go to the file <PROJECT_DIR>/app/connector.js and import the SAP Hybris Connector.
2. Extend the connector class and make any customizations you’d like. For a list of all the utility functions we’ve already built, read our HybrisConnector Reference docs.
3. Modify the getConnector method to return a new instance of your extended connector.