Qlik Saas blocking websocket connections from origins not the tenant

[mattkizaric-leveragelab]

Description

Hello,

I know enigma does not technically deal with authentication; however I was looking for some guidance on weird behavior that I have been experiencing while trying to use the library. All websocket connections fail unless the origin is our qlik saas tenant.

When running our SPA in development (localhost:5000) i have verified that I have the correct cookies and my qlik web integration id token are set correctly.

However creating a new websocket connection keeps failing:

When I try the very same configuration in the browser while in my qlik tenant, it works though:

Do we need to whitelist origins for the websocket to connect to? I have also replicated this in our dev environment incase it was a http vs https problem.

Steps to Reproduce

1. Attempt to create a connection following the steps in this tutorial. Fails
2. Attempt to use the same websocket url connection in a browser at the qlik saas tenant. Succeeds

Expected behavior

Creation of enigma session (Websocket) should not fail.

Actual behavior

Creation of the underlying websocket only works when the origin in the request is the qlik saas tenant

Environment

Library

[ ] Node.js
[ X ] Browser

Operating system

[ ] Windows
[ X ] OSX
[ ] Linux

Qlik Sense

[ ] Desktop
[X] Enterprise

Versions

• Node.js:
• Browser: Chrome: 89.0.4389.82
• Qlik Sense: ?
• Operating system: macOS Catalina 10.15.7
• [Other relevant versions]

[axelssonHakan]

Hi

Sorry for the late answer. I have tried the linked tutorial, and I'm able to connect to a QCS app after adding the host to web-integration (in my case https://127.0.0.1:8080)

Do you have any example code you can share?
What kind of devServer are you using?

[mattkizaric-leveragelab]

@axelssonHakan We are using firebase's hosting emulator for local development. As for our frontend web framework, we are using React. Our team has been able to log in successfully with qlik as shown above, however even when we whitelist our dev domain for the web-integration we are unable to connect via websockets to our qlik domain.

In Chrome Console:

const webIntegrationId = ""
const csrfToken = ""
const appId = ""
const tenantUri = ""
let wsurl = `${tenantUri.replace(
      'https',
      'wss'
    )}app/${appId}?qlik-web-integration-id=${webIntegrationId}&qlik-csrf-token=${csrfToken}`
new WebSocket(wsurl);

It's my understanding that similar code is called by enigma here. I have verified that calling the enigma library leads to the same result as the above code.

Could you see if the above snippit works for you in the developer console? We have a temporary solution right now with embedded sheets, so I was able to verify that this worked in the domain context of our qlik saas tenant.

[axelssonHakan]

I just installed the hosting emulator and it seems fine to "integrate" the tutorial you mentioned.

I'm using the config from the tutorial:

  try {
    // fetch the CSRF token:
    const res = await request('/api/v1/csrf-token', false);
    const csrfToken = res.headers.get('qlik-csrf-token');

    // fetch the list of available apps:
    const apps = await request('/api/v1/items?resourceType=app');

    if (!apps.data.length) {
      titleElement.innerHTML = 'No apps available';
      return;
    }

    // grab the first app id in the list:
    const appId = apps.data[0].resourceId;

    // build a websocket URL:
    const url = `${tenantUri.replace(
      'https',
      'wss'
    )}/app/${appId}?qlik-web-integration-id=${webIntegrationId}&qlik-csrf-token=${csrfToken}`;

    // fetch the engine API schema:
    const schema = await (
      await fetch('https://unpkg.com/enigma.js@2.7.0/schemas/12.612.0.json')
    ).json();

    // create the enigma.js session:
    const session = window.enigma.create({ url, schema });
    const global = await session.open();

    // open the app, and fetch the layout:
    const app = await global.openDoc(appId);
    const appLayout = await app.getAppLayout();

    // finally, present the app title in your web app:
    titleElement.innerHTML = appLayout.qTitle;
  } catch (err) {
    window.console.log('Error while setting up:', err);
  }

[mattkizaric-leveragelab]

@axelssonHakan Hmmm I'll test this over the weekend and post my findings. What version of chrome are you on? I know with recent updates with cookies, we have issues with incognito browsers not authenticating end users. Our whitelabed solution is using JWT authentication and maybe the qlik cookies are not being passed with the request.

[mattkizaric-leveragelab]

@axelssonHakan I went back and did the tutorial again. My issue was as a tenant admin I am able to see all apps across spaces, but I was not explicitly added to the space of the app i wanted to connect to. Interestingly, I am able to embed an iframe and calling the Qlik api while in our Saas UI via the browser console worked fine regardless of my space access. That does not seem to be related to enigma, but I appreciate your timely responses. Closing this issue.

[axelssonHakan]

Thanks for responding with updated status