Client refresh: Are reconnects supposed to re-trigger onConnect on the server?

[theogravity]

I'm following the ws server and client auth usage with token expiration, validation and refresh example, and on my client have the following:

    connectionParams: async () => {
        // returns auth headers with current token
    },
    on: {
      connected: (socket: any) => {
            onRefreshRef.current = () => {
              if (socket.readyState === WebSocket.OPEN) {
                socket.close(4205, 'Client Restart');
              }
          }}
      }

I've made sure the close call get triggered, but:

• I do not see connectionParams getting called to grab the latest token
• The onConnect handler on the server side in useServer() doesn't get called at all

I am able to make new subscriptions thereafter, but it will end up using the old token as my auth happens in onSubscribe on the server side. Am I doing something wrong here?

• I do have lazy enabled
• On subsequent calls to onRefreshRef.current, the socket readyState is 3, so it won't do socket.close after that. I would think when it reconnects the socket reference should get updated via an onConnected call...

[theogravity]

Update: It seems the first restart does indeed call onConnect on the server side, but I guess it doesn't work for subsequent calls because the socket is in a closed state thereafter.

It looks like I would need to obtain the new socket reference via on.opened(socket) for this to work out.

[enisdenjo]

@theogravity I have added tests making sure both opened and connected get the latest socket reference on each reconnect and they pass. Can you explain more about your reconnection process? A repro or a failing test would be great!

[theogravity]

Thanks for this! I'll see if I can provide a sample tomorrow for you.

[theogravity]

Sorry for the delay. Here's the reproduction repo:

https://github.com/theogravity/graphql-ws-socket-reconnect-issue

(Sorry for the bad project structuring. It's not how I structure my work in my normal OSS or work projects! Just needed to write a quick example for you that works.)

• The client code in question is in frontend/src/graphql-client
  • The re-connection code is in frontend/src/graphql-client/index.ts
• The code to connect to the subscription server is frontend/src/App.tsx

Basically, I create a handler that allows the app to tell the client it's time to refresh the connection. onConnect re-triggers, but it's with a stale socket.

It's possible the onRefreshRef.current reference isn't being updated appropriately in ApolloClientWS.ts.

Install instructions:

Have two terminals opened.

In first terminal:

• In project root, run npm i / yarn to install modules
• yarn dev to run the backend server

In second terminal:

• Change to frontend/, run npm i / yarn to install modules
• yarn start to start the frontend server

A generic scaffold page should pop up. Open up the devtools inspector to watch for the socket readyState value; the client refreshes after 10s:

Then in my actual code, I've solved the problem via:

on: {
      closed: () => {
        disconnected = true;
      },
      opened: (socket) => {
        if (onConnected) {
          // Refresh the socket reference so subsequent refreshes
          // will work properly
          onConnected(socket);
        }
      },
   ...
}

[theogravity]

@enisdenjo ^ just pinging to make sure you saw the response. I'm not waiting for one personally as I have a solution on my end.

[enisdenjo]

Hey, yes, I saw it. Just haven't had time to check it out. Will do so soon though.

[enisdenjo]

Nothing to do with graphql-ws, the connected listener was not used properly. See https://github.com/theogravity/graphql-ws-socket-reconnect-issue/pull/1 for more info.

[theogravity]

Nothing to do with graphql-ws, the connected listener was not used properly. See https://github.com/theogravity/graphql-ws-socket-reconnect-issue/pull/1 for more info.

Thank you for taking the time to look at it!