X-use-polaris header blocked by CORS policy Amazon Connect Chat

[GillesDeLeus]

Hi,

Can anyone tell me how I can remove the X-use-Polaris header from the requests that ServiceNow sends?

I was working on integrating Amazon Connect Chat widget in my ServiceNow Service portal but ran into a CORS issue when upgrading to Utah.

ServiceNow sends a request to AWS Connect API with the request header "X-Use-Polaris": false. This request header is not allowed by AWS, and I get an error message that a CORS policy has blocked the request. (see request.png and 
error message.png)

I solved this issue by deploying a custom API gateway and allowing the header, but I quickly ran into another issue caused by the X-Use-Polaris header.
After calling the API, the widget tries to send a request to the Amazon Connect participant service once again. This service doesn't allow the X-use-Polaris header and thus results in an error caused by CORS policy (see participant error.png).

I contacted the AWS support team to see if they could solve the issue. They told me that it is not possible for me to customize the allowed headers for the participant service and they won't allow the headers themselves.
They told me that the only way to make the Chat functionality work again is to remove the X-Use-Polaris header from the requests ServiceNow sends.

I have tried to modify the headers that are being sent and was able to add or edit the request headers, but removing the X-Use-Polaris header seems impossible.

Thanks in advance and kind regards

Gilles

[Ratnakar7]

Hi @GillesDeLeus ,

The X-Use-Polaris header is added by ServiceNow's AJAX engine and is not a header that can be easily removed or modified. One possible solution could be to use a proxy server to intercept the requests and modify or remove the header before forwarding the request to AWS Connect.

Another solution could be to create a custom integration with AWS Connect using ServiceNow's REST API instead of the AJAX engine. This would allow you to have more control over the headers being sent and received.

To implement this solution, you would need to create a REST message in ServiceNow that points to the AWS Connect API endpoint you want to use. You would then need to create a script include that uses the REST API to make the request to AWS Connect and return the response. Finally, you could use this script include in your widget to send requests to AWS Connect without the X-Use-Polaris header.

Here is some sample code for the script include:

var AWSConnect = Class.create();

AWSConnect.prototype = {
  initialize: function() {
    // Set up REST message
    this.restMessage = new sn_ws.RESTMessageV2();
    this.restMessage.setHttpMethod("GET");
    this.restMessage.setEndpoint("https://your-aws-connect-endpoint.com/api/your-resource");
    this.restMessage.setRequestHeader("Content-Type", "application/json");
    this.restMessage.setRequestHeader("Authorization", "Bearer your-access-token");
  },

  getResource: function(resourceId) {
    // Set up request parameters
    var queryParams = {
      id: resourceId
    };
    this.restMessage.setQueryParameter(queryParams);

    // Make the request and return the response
    var response = this.restMessage.execute();
    return response.getBody();
  }
};

In your widget, you could then instantiate the AWSConnect object and call the getResource function to make requests to AWS Connect:

var awsConnect = new AWSConnect();
var response = awsConnect.getResource("your-resource-id");

Note that you will need to replace "your-aws-connect-endpoint.com" and "your-access-token" with the appropriate values for your AWS Connect instance.

If my response helps you to resolve the issue close the question by ✅Accepting solution and hit 👍thumb icon. From Correct answers others will get benefited in future.

Thanks,

Ratnakar

[GillesDeLeus]

Hi @Ratnakar7 

Thank you very much for your response. The problem is that I don't call the API or service myself.
Instead I create a script using the following snippet: 

(function(w, d, x, id){
    s=d.createElement('script');
    s.src='https://d1ddlw7p7j6hta.cloudfront.net/amazon-connect-chat-interface-client.js';
    s.async=1;
    s.id=id;
    d.getElementsByTagName('head')[0].appendChild(s);
    w[x] =  w[x] || function() { (w[x].ac = w[x].ac || []).push(arguments) };

This script will call the API endpoint  https://xxxxxxx.execute-api.eu-central-1.amazonaws.com/prod/widget/2845c5cc-xxxx-xxxx-xxxx-3db9276ca..., and this API is refusing the X-Use-Polaris header. 

Will the solution you provided with using REST API and script includes also work if I don't call the API directly in the client controller but rather through the script?

I have also found another way of implementing the chat interface with this repo: chat-ui-examples

The problem here is that the at step 11 of the guide, I get a response unsuccessful connection because the script is trying to call the Amazon Connect Participant Service which doesn't allow the X-Use-Polaris header either.  is there a way to call the chatJS library that is included in the widget as a JS include to remove the X-Use-Polaris header to that service?

[Vladislav1]

I can't tell you how to overcome it but i can tell you how ServiceNow is adding it.

They are intercepting the XMLHttpRequest.send method call and adding the X-Use-Polaris header everytime you call it over a portal script. Even if you call it with some third part library in the end it's still a XMLHttpRequest wrapped call. And there is no way to remove this header, or any header, from the XMLHttpRequest call, because there isn't a method for that. You can re set this header with a different value but this will not help you.

They are doing it via their bundle instance-name.service-now.com/scripts/js_includes_sp_libs.jsx?.... and it looks like this

(function(send) {
    if (typeof (NOW.portal_url_suffix) !== 'string' || NOW.portal_url_suffix.trim() === '') {
        return;
    }
    var interfaceEnv = 'Web';
    var interfaceType = 'Service Portal';
    if (isMobile()) {
        interfaceEnv = 'Mobile';
        interfaceType = 'Mobile-Web';
    }
    var headerValue = 'Interface=' + interfaceEnv + ',Interface-Name=' + NOW.portal_url_suffix.toUpperCase() + ',Interface-Type=' + interfaceType + ',Interface-SysID=' + NOW.portal_id;
    var loc = window.location;
    var anchor = document.createElement('a');
    var hasPolarisSupport = (''.indexOf(NOW.portal_id) != -1).toString();
    XMLHttpRequest.prototype.send = function(data) {
        this.setRequestHeader('X-Use-Polaris', hasPolarisSupport);
        anchor.href = this._url;
        if (anchor.hostname === loc.hostname && anchor.port === loc.port && anchor.protocol === loc.protocol)
            this.setRequestHeader('X-Transaction-Source', headerValue);
        send.call(this, data);
    }
}
)(XMLHttpRequest.prototype.send);

 If you have access to a HI portal account to open a ticket with their business support it would help me too. And other poor souls that have a issue with this 'feature'.

At least they could provide a way to disable this header from being set with a system property if they insist of being used. It make sense to set it when you're POSTing to another servicenow instance. But when you're using some other REST API than ServiceNow it gets in the way. 

Now i can't tell you for sure if the other header X-Transaction-Source will not get in the way as well.

[GillesDeLeus]

Hi @Vladislav1 

Thanks so much for this insight. This clarifies a lot for me.
I am in the process of creating a HI support ticket for this issue. As soon as I get an answer from the support team, I'll update this post.

When deploying the custom API, I ran into the same issue with the X-UserToken header; this was quickly resolved by allowing the header in the API.

When looking at the OPTIONS requests, I see that the access-control-request-headers only contain the X-Use-Polaris & X-UserToken when contacting the API and when contacting the Participant service it only contains the X-Use-Polaris so I don't expect any other CORS issues to arise after removing the X-use-Polaris one.