Websocket Authentication issues

[clwillingham]

Environment

---

• Operating System: Linux
• Node Version: v16.17.1
• Nuxt Version: 3.7.4
• CLI Version: 3.9.0
• Nitro Version: 2.6.3
• Package Manager: [email protected]
• Builder: -
• User Config: css, devtools, modules, apollo
• Runtime Modules: @nuxtjs/[email protected]
• Build Modules: -

---

(actually using bun which for the most part has been working, but I have tested through node as well)

Describe the bug

In the current implementation of the Nuxt 3 Apollo module, websocket authentication does not work effectively against Hasura. Hasura expects the headers, including the authorization headers, to be embedded within a headers key in the initial connection_init message. However, the Apollo module configures the websocket link to include the authorization key at the root of the payload key. This discrepancy leads to an authentication failure.

Actual Behavior

The authorization key is being sent at the root payload key, leading to an error with Hasura. The actual payload structure is:

{
  "type": "connection_init",
  "payload": {
    "Authorization": "Bearer ..."
  }
}

Expected behaviour

The authorization headers should be encapsulated within a headers key to be compatible with Hasura’s expected payload structure. For example:

{
  "type": "connection_init",
  "payload": {
    "headers": {
      "content-type": "application/json",
      "Authorization": "Bearer ..."
    }
  }
}

Reproduction

1. Set up a Nuxt 3 project with Apollo and configure it to use websocket for subscriptions.
2. Integrate with a Hasura GraphQL endpoint that requires authentication.
3. Use the onLogin method to set the Bearer token for authentication.
4. Watch sadly as your subscription requests are rejected and Hasura gaslights you by telling you that it doesn't know what your looking for (as is expected when your not authorized to access a resource in Hasura)

Additional context

My fork with my own solution is available here: https://github.com/clwillingham/apollo the fix was simple, I just wrapped the Auth header: https://github.com/nuxt-modules/apollo/compare/v5...clwillingham:apollo:v5

Suggested Solutions:

1. Expose connectionParams in the configuration, making the websocket link configurable to accommodate various payload structures.
2. Introduce a boolean setting to toggle the placement of authorization headers, either at the root of the payload or within a headers key.
3. Set the authorization headers within the headers key by default, if that is a universal expectation across GraphQL servers.

Enhancing the configurability of connectionParams would cater not only to this specific issue but also provide flexibility for developers to customize the connection_init message as per their requirements, for example, sending the Hasura admin key during early sandbox development.

Logs

No response