2

I'm getting the following error in my react application using enigma.js (https://qlik.dev/apis/javascript/enigmajs) . I'm trying to initialize a WebSocket connection and im getting the error. "Failed to construct 'WebSocket': The subprotocol '[object Object]' is invalid".

The WebSocket connection URL is correct as it can be tested with https://catwalk.core.qlik.com/?engine_url=wss://sense-demo.qlik.com/app/133dab5d-8f56-4d40-b3e0-a6b401391bde which returns the data. You can try by editing the URL which will return an error.

the code is

async init() {
    
const appId = "133dab5d-8f56-4d40-b3e0-a6b401391bde";
    const url =
      "wss://sense-demo.qlik.com/app/133dab5d-8f56-4d40-b3e0-a6b401391bde"; 

    const session = enigma.create({
      schema,
      createSocket: () =>
        new WebSocket(url, {
        }),
    });

    const global = await session.open();
    const app = await global.openDoc(appId);
    const appLayout = await app.getAppLayout();

    console.log(appLayout);

  }
Giorgi Gvimradze
  • 1,714
  • 1
  • 17
  • 34
gangata arun
  • 151
  • 2
  • 9
  • what is `appId` there? – Giorgi Gvimradze Aug 25 '21 at 23:15
  • @GiorgiGvimradze I have edited the code. appid is now declared. AppId is the id of the document I want to connect to. The code is failing at the websockets connection. The connections need to be established where a session is open and then the document is opened. But here the WebSocket connection is the issue. The code was built from example [https://qlik.dev/] – gangata arun Aug 25 '21 at 23:29
  • I just started it on codesandbox.io and got the response, which has this inside: `qTitle: 'Helpdesk Management'` and a lot more. do you want me to share the code and links? – Giorgi Gvimradze Aug 25 '21 at 23:43
  • @GiorgiGvimradze yes, that's the result I'm expecting. can you share the link and code please I created an app using `npx create-react-app my-app` and running the function on the app.js. – gangata arun Aug 25 '21 at 23:50
  • here is the source for React project: https://community.qlik.com/t5/Qlik-Design-Blog/enigma-js-with-React-Hooks-API-and-React-Context/ba-p/1621257, this is my working sandbox link for NodeJS project https://codesandbox.io/s/new-feather-mme3i?file=/src/index.js:692-708, which outputs what was needed, but the React project gives error here: https://codesandbox.io/s/frosty-cdn-onxvi?file=/src/qDoc.config.js you can see the error in console! – Giorgi Gvimradze Aug 26 '21 at 00:23

2 Answers2

0

I found the solution: qDoc.config.js

const enigma = require('enigma.js');
const schema = require('enigma.js/schemas/12.20.0.json');
const SenseUtilities = require('enigma.js/sense-utilities');

const config = {
  host: 'sense-demo.qlik.com',
  secure: true,
  port: 443,
  prefix: '',
  appId: '133dab5d-8f56-4d40-b3e0-a6b401391bde',
};

const url = SenseUtilities.buildUrl(config);

async function init() {
  const session = enigma.create({
    schema,
    url,
    suspendOnClose: true,
  });

  const global = await session.open();
  const app = await global.openDoc(config.appId);
  const appLayout = await app.getAppLayout();

  console.log(appLayout);
}
init();

const session = enigma.create({ schema, url, suspendOnClose: true });

// open doc and return promise which will resolve to doc
export const openDoc = () => (
  session.open().then((global) => global.openDoc(config.appId))
);

// close session
export const closeSession = () => (
  session.close()
);

INSTURCTION

  1. downoad this project
  2. delete package-lock.json file
  3. npm i
  4. npm run-script dev
  • This is the direvtory view:

enter image description here

  • This is result log:
    enter image description here
Giorgi Gvimradze
  • 1,714
  • 1
  • 17
  • 34
0

The solution is explained here

https://github.com/qlik-oss/enigma.js/issues/889

gangata arun
  • 151
  • 2
  • 9