Any idea why subscribe is not working?

[mowses]

Hello, I will try to go direct to the point

I followed all the tutorials of configuring laravel with pusher for broadcasting. I made it work OK for public, private and presence channels. everything is working in my testing env.

However, I needed to make it work with graphql subscriptions, and followed the lighthouse tutorial, then I reached your thekonz/apollo-lighthouse-subscription-link library. And now I got stuck and dont know how to proceed. I hope you could help me.

The issue is I dont know why the lib is not subscribing to my lighthouse channel. After I run client.subscribe, the server simple does not show any info about sucessful subscribing to it, despite the fact it receives the authorization info from server, thus, after I manually trigger the subscription, the client does not receive anything, but the server says the event were triggered.

Here is the important part of the code my app is running:

echo-test.js

const echo_graphql = new Echo({
    broadcaster: 'pusher',
    key: 'your-pusher-key',
    wsHost: '127.0.0.1',
    wsPort: 6001,
    forceTLS: false,
    disableStats: true,
});

const authMiddleware = new ApolloClient.ApolloLink((operation, forward) => {
  // add the authorization to the headers
  operation.setContext(({ headers = {} }) => ({
    headers: {
      ...headers,
      authorization: 'Bearer ' + token,
    }
  }));

  return forward(operation);
})

const httpLink = new ApolloClient.HttpLink({
    uri: 'http://127.0.0.1:8000/graphql',
    fetch,
});

const link = ApolloClient.ApolloLink.from([
    authMiddleware,
    createLighthouseSubscriptionLink(echo_graphql),
    httpLink, // your existing http link to your graphql api
  ]);

const cache = new ApolloClient.InMemoryCache();

const client = new ApolloClient.ApolloClient({
    link,
    cache,
});

const subscriber = client
  .subscribe({
    query: ApolloClient.gql`
    subscription gameSessionStarted {
        gameSessionStarted {
            id
        }
    }
    `,
  })
  .subscribe(({ gameSessionStarted }) => {
    console.log(gameSessionStarted, 'SUBSCRIBE RESULT <<<< this is the part that is not triggered');
  });

schema.graphql:

extend type Subscription {
  gameSessionStarted(id: ID @eq): User @guard(with: "api") @subscription(class: "\\App\\GraphQL\\GameSessionStarted")
}

Both authorize and filter methods of App\GraphQL\GameSessionStarted explicitly returns true

---

Inspecting your library, I realize that the file node_modules/@thekonz/apollo-lighthouse-subscription-link/dist/index.js:28 (my package.json version is "^1.2.3") is returning the following data:

{
  data: { gameSessionStarted: null },
  extensions: {
    lighthouse_subscriptions: {
      version: 2,
      channel: 'private-lighthouse-lXVEg0rPwzvzMM6U6kWCgwCo5x8goTSu-1625374663'
    }
  }
}

And the server is displaying:

New connection opened for app key your-pusher-key.
serve-websockets-1      | Connection id 631329104.314645804 sending message {"event":"pusher:connection_established","data":"{\"socket_id\":\"631329104.314645804\",\"activity_timeout\":30}"}

After I manually trigger the broadcast event (Subscription::broadcast('gameSessionStarted', User::find(1));), the server replies the following:

queue-listen-2          | [2021-07-04 04:59:45][czlHOCygNo3hpKX5JZxyLE3zXjifPg7f] Processing: Nuwave\Lighthouse\Subscriptions\BroadcastSubscriptionJob
queue-listen-2          | [2021-07-04 04:59:45][czlHOCygNo3hpKX5JZxyLE3zXjifPg7f] Processed:  Nuwave\Lighthouse\Subscriptions\BroadcastSubscriptionJob

But no data is returned to client. Do I am missing something? Could you point me to a direction? I have no idea on what could be.

Thanks for any help.

[thekonz]

The library currently only supports lighthouse subscriptions version 1. I don't have the time right now to add support to that, but I will add it soon (hopefully).

Until then, please go to your config and set subscriptions.version to 1. Sorry for the inconvenience.

[mowses]

Thanks for your reply. I will chance that.

[JavierMartinz]

Hey @thekonz , sorry to send another comment to this closed issue, but we are struggling when we try to use this link.

Is it working already with version 2 or should we still use version 1? If I use version 1 I always get this error, even though authentication looks fine and I don't get errors in the browser, just this one in the Debug console of Pusher Dashboard:

[thekonz]

You need version 1. This package does not work with version 2.

Did you specify the authEndpoint in your echo client? It needs to be set to graphql/subscriptions/auth.

[JavierMartinz]

Yes @thekonz. If I use version 1 and that authEndpoint I'm getting errors such as the one I pasted in my last comment. This is how I initialise the client:

const pusherClient = new Pusher(process.env.NEXT_PUBLIC_PUSHER_APP_KEY as string, {
      authEndpoint: `http://${process.env.NEXT_PUBLIC_API_URL}/graphql/subscriptions/auth`,
      cluster: process.env.NEXT_PUBLIC_PUSHER_APP_CLUSTER,
      ...(token && {
        auth: {
          headers: {
            Authorization: `Bearer ${token}`,
          },
        },
      }),
    });

const echo = new Echo({
      broadcaster: 'pusher',
      key: process.env.NEXT_PUBLIC_PUSHER_APP_KEY,
      namespace: 'Edx.Events',
      encrypted: true,
      client: pusherClient,
    });

[thekonz]

In the laravel docs I only see authEndpoint on the Echo object. Not sure if it works the same on the Pusher object.

[JavierMartinz]

Yeah, it's the same, because if you provide a pusher client to echo it will use it. I need to do so, because otherwise Echo complains about Pusher is not defined in React.

Furthermore, I can see the auth request