Skip to main content
Question

How to connect graphql

  • September 2, 2025
  • 9 replies
  • 92 views

Hi Cognite Community,

I'm building a React + TypeScript app using Apollo Client to connect to the CDF GraphQL API. It shows a Knowledge Graph of assets, time series, P&ID diagrams, and 3D models using vis-network.

✅ I already did this successfully using the Python SDK.

Now, I need help with:

Setting up the GraphQL endpoint in React

Handling authentication from the frontend

Any simple examples or tips would be greatly appreciated. Thanks!

9 replies

Hi,

 

Great to hear you’ve made progress and are already putting Cognite APIs to work!

 

To get started on your question, the first step is to install and set up the SDK.

 

You can follow this detailed guide, which includes code examples for authenticating in your browser:

https://github.com/cognitedata/cognite-sdk-js

https://github.com/cognitedata/cognite-sdk-js/blob/master/guides/authentication.md


 

Once you’ve got authentication running smoothly, the GraphQL part is a breeze.

Here’s some sample code you can use to run GraphQL queries against your data model and start exploring right away:

import { CogniteClient } from '@cognite/sdk';

const cdfClient = new CogniteClient({
appId: 'sample-app',
baseUrl: 'https://api.cognitedata.com',
project: 'demo-project',
oidcTokenProvider: async () => { ... },
});

// handle authentication
await cdfClient.authenticate();

interface GraphQlQueryParams {
query: string;
operationName?: string | null;
variables?: Record<string, any>;
}


interface RunQueryDTO {
space: string;
dataModelExternalId: string;
dataModelVersion: string;
graphQlParams: GraphQlQueryParams;
}

const runQuery = (
{space, dataModelExternalId, dataModelVersion, graphQlParams}: RunQueryDTO
): Promise<GraphQLQueryResponse> {
const url = getDataModelEndpointUrl(
space,
dataModelExternalId,
dataModelVersion
);
return new Promise((resolve, reject) => {
cdfClient
.post(url, {
data: graphQlParams,
})
.then((response) => {
if (response.data.errors) {
const errorMsg =
response.data.errors
?.map((el: { message: string }) => el.message)
.join('\n')
.trim() ||
'Something went wrong, we were not able to run your query.';
reject(errorMsg);
} else {
resolve(response);
}
})
.catch((err) => {
reject(err);
});
});
}


const getDataModelEndpointUrl = (
space: string,
dataModelExternalId: string,
version: string,
) => {
return `${cdfClient.getBaseUrl()}/api/v1/projects/${
cdfClient.project
}/userapis/spaces/${space}/datamodels/${dataModelExternalId}/versions/${version}/graphql`;
};

// Then you could use it like this
const response = await runQuery({
space: 'test-space',
dataModelExternalId: 'your_data_model_externalId',
version: 'v1' //put the version that you want to query here
graphQlParams: {
"query":"query MyQuery($filter: _ListSimpleTypeFilter) {\n listSimpleType(filter: $filter) {\n items {\n description1\n externalId\n }\n }\n}","variables":{"filter":{"space":{"eq":"your-space"}}},
"operationName":"MyQuery"
}

})


Also, you could use the Query Explorer screen in the Data Modeling UI in fusion.
You can explore you GraphQL Data model there and if you click on `Connections` that is on the upper right corner on the screen, you can get the URL to your GraphQL endpoint.


  • Author
  • Committed
  • September 3, 2025

hi ​@Branko Dimitrijoski ,

 

requested to enable the Visualize Data Model feature on my account, please.

 


  • Author
  • Committed
  • September 5, 2025

hi 
 

I am writing to request that our client ID (1b90ede3-271e-401b-81a0-a4d52bea3273) be granted the necessary permissions for the publicdatacdm project. Specifically, we require access to the following:

Data modeling

GraphQL endpoint

Space and data model listing

Thanks


Mithila Jayalath
Seasoned Practitioner
Forum|alt.badge.img+8
  • Seasoned Practitioner
  • September 5, 2025

@Haris vk can you please try again now and let me know whether the client ID (1b90ede3-271e-401b-81a0-a4d52bea3273) as read access to Data modeling, GraphQL endpoint, Space and data model listing?


  • Author
  • Committed
  • September 5, 2025

hi ​@Mithila Jayalath ,

 

app.cognite.service: Found 1 data model

In the publicdatacdm space, only one data model is currently available, which is related to 3D scenes.

However, our goal is to create a knowledge graph, which requires asset-related data models. Since the available model is focused on 3D scene configuration, it doesn't cover the necessary asset relationships.

To move forward with building a knowledge graph, we need:

  • Asset-centric data models.

  • A clustering mechanism to visualize and structure the knowledge graph meaningfully.

Is there any plan to include asset-related models in publicdatacdm, or any recommended approach to achieve this with the current setup?


  • Author
  • Committed
  • September 6, 2025

H ​@Mithila Jayalath ,

Can you please grant relationship API permissions in the Python SDK?

I am getting this error:

Could not fetch relationships: User does not have relationships permissions. 
code: 403 | X-Request-ID: 10dc4192-f4f6-91e1-9c0c-929eefa8bd15 | cluster: api | project: publicdatacdm


Mithila Jayalath
Seasoned Practitioner
Forum|alt.badge.img+8
  • Seasoned Practitioner
  • September 8, 2025

Can you please grant relationship API permissions in the Python SDK?

@Haris vk I have added the client application to the read-only group of the publicdatacdm project previously. Unfortunately we are not permitted to add/update capabilites of the group.


  • Author
  • Committed
  • September 8, 2025

Hi ​@Mithila Jayalath ,
I tried to list the API for relationships, which I believe is read-only.
However, I still got an error:
"Could not fetch relationships: User does not have relationships permissions


Mithila Jayalath
Seasoned Practitioner
Forum|alt.badge.img+8
  • Seasoned Practitioner
  • September 8, 2025

@Gaetan Helness do you know whether there is a reason for not adding the relationships read capability in the read-only group?