Retrieve Content from OCE

Once an image has been published to OCE, it can be retrieved for display in your application by using the image slug.

Here's how you can set up your application to retrieve content from OCE:

  1. Navigate to the Assets menu in OCE.

  2. Select the appropriate repository (for example, DX4C Media).

    The images are displayed.

  3. Right-click on an image and select Properties.

    The slug is displayed under Friendly URL Slug.

  4. Enter the slug as a parameter in the @oracle-dx4-buying/common/utils/getOCEImageUrl utility function to generate the URL for an image published to OCE.

Here's the source code of the @oracle-dx4-buying/common/utils/getOCEImageUrl function:

export const getOCEImageUrl = (slug, state) => {
  const dx4cOceUrl = getStoreSetting(DX4C_OCE_URL, state);
  const dx4cOceChannelToken = getStoreSetting(DX4C_OCE_CHANNEL_TOKEN, state);
 
  return `${dx4cOceUrl}/content/published/api/v1.1/assets/.by.slug/${slug}/native?channelToken=${dx4cOceChannelToken}`;
};

The @oracle-dx4-buying/common/utils/getOCEImageUrl function uses the dx4cOCEUrl and dx4cOCEChannelToken values as well as the slug of the respective image to generate the URL of the image.

You can also use the @oracle-dx4c-buying/components/call-to-action and @oracle-dx4c-buying/components/call-to-action-image components to display images from OCE by passing the oceImageSlug as a property to these components. The application's Home page contains a number of examples of the Call To Action component displaying images from OCE.