Pricefx Front-end Embedding an External Application

Available since version 11.0 (Paper Plane)

Pricefx front-end can embed an external application. Such application will be rendered inside of a tab on a CLIC detail page.

To configure it, modify the configuration of a CLIC Type (e.g. a Quote Type), and add a new custom tab of widget type externalApp to the Configuration field. For details about custom tabs, see Detail Page Layout and Dynamic Tabs.

Example of a Quote Type configuration including a tab with embedded externalApp for Survey:

{
  "name": "default",
  "tabs": [
    {
      "name": "items",
      "type": "items",
      "translationKey": "sfdc_quotes_tabs_items"
    },
    {
      "name": "header",
      "type": "header",
      "translationKey": "sfdc_quotes_tabs_header"
    },
    {
      "name": "Survey",
      "type": "externalApp",
      "translationKey": "Survey",
      "parameters": {
        "externalAppUrl": "https://mysurvey.com/",
        "externalAppParameters": [
          {
            "some-flag": ""
          },
          {
            "quoteId": "id"
          }
        ]
      }
    }
  ]
}

Parameters of externalApp widget:

Parameter	Description

Parameter

Description

externalAppUrl

URL of the external application to be rendered.

externalAppParameters

Parameters, which will be passed in the URL as query string parameters.

The value of this externalAppParameters field can be either an object or an array of objects, depending on your needs.

If it is an object (with key-value pairs), the keys will be parsed as the string parameters keys and their corresponding value will be possible fields to be mapped from the CLIC object: externalRef, label, uniqueName and id. If an empty string is passed, it is parsed without any value.
If it is an array, it behaves the same way but fields will be provided in the final query string parameters in the same order as they are given.

Example of 2 parameters:

"externalAppParameters": [
  {
    "some-flag" : ""
  },
  {
    "quoteId" : "id"
  }
]

The example above will end up as query string ?some-flag&quoteId=123.

Please note that the application is embedded through an iframe, therefore it has some limitations as described in https://www.w3schools.com/tags/att_iframe_sandbox.asp. Currently, the permissions given are "allow-scripts allow-same-origin allow-forms allow-popups”.

The external application front-end can communicate with Pricefx front-end through the Messaging API.