How to Capture External User Details in Pega Web Embed via additionalHeaders

[CharanRathod]

I am implementing Pega Web Embed to allow users from an external system to interact with a Pega application (e.g., for case creation, assignment submission, or viewing user pages).

I have a requirement to capture and identify the external user’s details (such as a user ID, name, or system token) every time their session initiates a request to the Pega server. My understanding is that the additionalHeaders attribute in the Web Embed configuration is the intended method to pass this information.

However, I am unsure of the correct syntax and structure to use for this attribute. The documentation I’ve found does not provide a clear example.

What I’ve Tried/Ideas:

• I have configured the basic Web Embed component successfully and it functions for its primary purpose (case creation, etc.).

• I am attempting to use the additionalHeaders attribute to include the user information in the HTTP headers of the requests made to Pega.

• I am looking for a way to dynamically pass values from the external system into these headers.

  My Current Web Embed Code Snippet:(sample)

• <pega-embed
  id=‘myEmbed’
  action=‘createCase’
  caseTypeID=‘MyCo-MyApp-Work-MyCaseType’
  casePage=‘assignment’
  appAlias=‘my-app-alias’
  pegaServerUrl=‘https://mypegaserver.com/prweb/’
  style=‘width:100%; height:500px;’
  startingFields=‘{“pyLabel”: “External Case”}’>
  

  What is the correct syntax for the additionalHeaders attribute to pass dynamic values? For example, if I have a JavaScript variable externalUserId, how would I structure the code to send it in a header called X-External-User-ID?

  I am looking for an example similar to this hypothetical structure:
  additionalHeaders=‘{“X-External-User-ID”: “[page/function/getUserID]”}’

  Any guidance, code examples, or pointers to relevant documentation would be greatly appreciated.

  Thank you.

[SudheerKumarGoudB3761 (Sudheer Kumar Goud Bollipally)]

Hi @CharanRathod

You can handle this with the additionalHeaders attribute. Just pass your external user details from JS into the embed like:

additionalHeaders='{"X-External-User-ID": "' + externalUserId + '"}' 

Now every request from the embed carries the user ID. On the Pega side, just read that header in your auth/service layer and map it.

eg :

<pega-embed
id=“myEmbed”
action=“createCase”
caseTypeID=“MyCo-MyApp-Work-MyCaseType”
pegaServerUrl=“https://mypegaserver.com/prweb/”
appAlias=“my-app-alias”
style=“width:100%; height:500px;”
additionalHeaders=‘{“X-External-User-ID”: "’ + externalUserId + ‘"}’>

[CharanRathod]

Hi @SudheerKumarGoudB3761,

Thank you for the help. The issue is resolved.

We used the additional header to receive the user details in DXApi Headers. However, we faced “No ‘Access-Control-Allow-Origin’ Header”.

The solution was to add the exact names of our custom header fields (from the additionalHeaders attribute) to the “Access-Control-Allow-Headers” setting in the CORS configuration on the Pega server.

Once the server was configured to explicitly allow our custom headers, the preflight requests succeeded, and the error was resolved.