Passing an auth token when running GraphQL codegen

[heinrichdude]

We have a HotChocolate GraphQL implementation protected by Keycloak. In the GraphQL code we put an [Authorize] attribute on the Queries and Mutations which enforces the user calling them to be authenticated. That all works well.

The issue we are running into is when we try to run codegen, it fails getting the schema due to the token being required.

I have tried a couple methods will no success so far. The one I feel I am closest with is referenced on the following page under the Javascript Exports section. https://www.graphql-code-generator.com/docs/getting-started/schema-field

Our yml file the we are trying to recreate (it works as longs as authentication is turned of) is as follows:

overwrite: true
schema: "http://localhost:5000/graphql"
documents: "apps/ccds-client/src/**/*/queries.ts"
generates:
  apps/ccds-client/src/generated/graphql.tsx:
    plugins:
      - "typescript"
      - "typescript-operations"
      - "typescript-react-apollo"
    config:
      withHooks: true
  ./graphql.schema.json:
    plugins:
      - "introspection"

We run it via a simple 'npm run codegen'

With the changes to accomodate the authentication we have change the schema line in the above yml file to:
schema: myCode.js

myCode.js is as follows:

const { buildSchema, printSchema, parse, GraphQLSchema } = require('graphql');
const axios = require('axios');
const loadSchema = require('@graphql-tools/load');
const UrlLoader = require('@graphql-tools/url-loader');

const doLoadSchema = async (access_token) => {
    await loadSchema('http://localhost:5000/GraphQL', {
        loaders: [new UrlLoader()],
        headers: {
            Accept: 'application/json',
            Authorization: 'Bearer ' + access_token
        },
        method: 'POST'
    })
    .then(res => {
        console.log(res);
        return printSchema(res);
    })
    .catch(error => {
        console.error("Error loading Schema:" + error)    
    });
};

const getSchema = () => {
    const url = 'https://someurl';

    const params = new URLSearchParams();
    params.append('param1', 'ccds-2021-api');
    params.append('param2', 'password');
    ...
    const requestConfig = {
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
        }
    };

    let access_token = '';

    axios.post(url, params, requestConfig)
    .then(res => {
        console.log(res.status)
        console.log(res.data.access_token);
        return doLoadSchema(res.data.access_token);
    })
    .catch(error => {
        console.error(error)
    });
}    

module.exports = getSchema();

This external code always results in the following:

Unable to find any GraphQL type definitions for the following pointers:
- schema.js

I feel its promising that I can take these two methods above and run them in a separate node.js script and I can see the token and the schema being logged to the console ... so it feels like its close. Passing the token via the loadSchema function works.

Annoyingly I can't seem to view the console logs under 'npm run codegen'

Any solutions / advice would be appreciated!

[ardatan]

Have you seen this?
https://www.graphql-code-generator.com/docs/getting-started/schema-field#supported-configuration

[heinrichdude]

The issue I have with that method is that our token's regularly expire (every 5 minutes I think) and then I will have to request a new one. Thus, my code goes and grabs a new one before loading the schema.

[ardatan]

I see so you can use custom schema loaders.
https://www.graphql-code-generator.com/docs/getting-started/schema-field#custom-schema-loader

[heinrichdude]

What I eventually did get to work was a node script.

I did the following:

• first I created a yaml file with the following structure for the schema element:

  schema:
    - http://localhost:5000/graphql:
        headers:
          Authorization: >-
            Bearer eyJhbGciOiJSUzI......

Create a node script that does the following:

• makes a request via axios to get the access token
• using js-yaml library, I load the corresponding yaml file and alter the schema node to contain the new access token in the header -> authorization json 'property', the write the yaml back out to file using js-yaml
• using an exec command re-run the generate with 'npm run yamlfile.yml'

Unfortunately, I found it way to difficult, not at all obvious, how to adapt the programmatic interface for generating to do the same as the yml configuration we had set up previously. I would have preferred to use the programatic interface rather than bring in the dependancy of the js-yaml but I was getting nowhere.

[dotansimha]

Unfortunately, I found it way to difficult, not at all obvious, how to adapt the programmatic interface for generating to do the same as the yml configuration we had set up previously. I would have preferred to use the programatic interface rather than bring in the dependancy of the js-yaml but I was getting nowhere.

Codegen accepts a JavaScript object (JSON) as input. You don't need to use the CLI when running it programmatically, you can use the core package, then you don't have to deal with YAML at all.
Also, note that codegen can load configuration files from js/json as well.