# Apollo Client useSubscription not reading correct link

**URL:** https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062
**Category:** Client SDKs
**Tags:** client, web
**Created:** [April 3, 2023, 6:32am UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062 "2023-04-03T06:32:21Z")
**Posts on this page:** 9
**Page:** 1

<div class="post-metadata">

### Author: ![Selimm12](https://avatars.discourse-cdn.com/v4/letter/s/87869e/32.png) [@Selimm12](https://community.apollographql.com/u/Selimm12)
#### Post date: [April 3, 2023, 6:32am UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062/1 "2023-04-03T06:32:21Z")

</div>

I hope you are doing well!

We are trying to implement web sockets in our website and we are using Apollo/Client v3 for the client side. Everything is working perfectly except for the subscription.

Here is the code for my client:

```auto
import { ApolloClient, InMemoryCache, split } from "@apollo/client";
import { getMainDefinition } from "@apollo/client/utilities";
import { GraphQLWsLink } from "@apollo/client/link/subscriptions";
import { createClient } from "graphql-ws";
import { HttpLink } from "apollo-link-http";

import { link, socketLink } from "./gql-link";

const httpLink = new HttpLink({
  uri: link,
});

const wsLink = new GraphQLWsLink(
  createClient({
    uri: socketLink,
  })
);

const splitLink = split(
  ({ query }) => {
    const { kind, operation } = getMainDefinition(query);
    return kind === "OperationDefinition" && operation === "subscription";
  },
  wsLink,
  httpLink
);

const client = new ApolloClient({
  link: splitLink,
  cache: new InMemoryCache(),
});

export default client;

```

the url used are:

```auto
export const link="http://dummydomain/backend/graphql/graphql";
export const socketLink = "ws://dummydomain/backend/graphql/graphql"

```

and here is the code for my subscription:

```auto

  const { subData } = useSubscription(
    ON_UPDATE_STATIONS,
    {
      variables: {
        req: {
          enableFilters: true,
          filters: filtersState,
          keys: {
            page: page + 1,
            pageSize: rowsPerPage,
          },
          siteID: fromSites ? siteGuid : null,
          keyword: search,
          orderColumn: orderColumn,
          orderDirection: orderDirection,
          //noSitesStations: false,
          userID: storeUserGuid,
        },
      }
    }
  );

```

and here is my subscription:

```auto
export const ON_UPDATE_STATIONS = gql`
  subscription ($req: GetStationsListModelInput!) {
    onUpdateStationSubscription(model: $req) {
      stationsListModel {
        stations {
          stationGuid
          stationStatus {
            description
          }
        }
        totalNumberOfRecords
      }
      errorMessage
      errorCode
    }
  }
`;

```

Whenever I open the page the subscription is on, I get the following error in the console

> POST [http://dummydomain/backend/graphql/graphql](http://dummydomain/backend/graphql/graphql) 500 (Internal Server Error)

I tried using the `subscribeToMore` property this way instead of the useSubscription

```auto
    subscribeToMore({
    document: ON_UPDATE_STATIONS,
    updateQuery: (prev, { subscriptionData }) => {
     console.log(prev, subscriptionData)
    }
  });

```

and I got an additional error in the console

> Unhandled GraphQL subscription error ServerError: Response not successful: Received status code 500

We are using the same links for web (React) and mobile (Flutter), and with flutter, the websocket is working so I don’t think is it because of the server. What could be the problem? I followed the entire Apollo/Client documentation on `useSubscription`.

---

<div class="post-metadata">

### Author: ![jerelmiller](https://sea1.discourse-cdn.com/flex019/user_avatar/community.apollographql.com/jerelmiller/32/3314_2.png) [@jerelmiller](https://community.apollographql.com/u/jerelmiller)
#### Post date: [April 3, 2023, 9:22pm UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062/2 "2023-04-03T21:22:21Z")

</div>

Hey @Selimm12 👋

It’s a bit difficult to understand with the code given here what exactly is happening without being able to interact with the code. Have you logged inside your `split` function to make sure it’s returning `true` when trying to send the subscription? The only reason the httpLink should be used is when that value is `false`, so let’s make sure to rule that possibility out.

---

<div class="post-metadata">

### Author: ![Selimm12](https://avatars.discourse-cdn.com/v4/letter/s/87869e/32.png) [@Selimm12](https://community.apollographql.com/u/Selimm12)
#### Post date: [April 4, 2023, 5:09am UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062/3 "2023-04-04T05:09:09Z")

</div>

Helloo @jerelmiller ,

When I console log inside the split function

```auto
const splitLink = split(
  ({ query }) => {
    const { kind, operation } = getMainDefinition(query);

    console.log({query, kind, operation })
    return kind === "OperationDefinition" && operation === "subscription";
  },
  wsLink,
  httpLink
);

```

I am getting only the first value ever and it’s never being called again, no matter if the url changes in React, unless I refresh the page then I get the result of the first query I have in the page then nothing is displayed again no matter any other page I enter unless I refresh.

---

<div class="post-metadata">

### Author: ![jerelmiller](https://sea1.discourse-cdn.com/flex019/user_avatar/community.apollographql.com/jerelmiller/32/3314_2.png) [@jerelmiller](https://community.apollographql.com/u/jerelmiller)
#### Post date: [April 4, 2023, 3:59pm UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062/4 "2023-04-04T15:59:52Z")

</div>

> no matter if the url changes in React

I’m not entirely sure what you mean here. Based on your code samples, it looks like you have static URLs. Would you be willing to share more on how you’re managing the URL?

It would make sense that you’d only ever see the `split` function called once if you’re issuing a single `useSubscription`, but I’m not sure what other queries/operations you’re sending through. What is logged in the invocation of that function?

---

<div class="post-metadata">

### Author: ![Selimm12](https://avatars.discourse-cdn.com/v4/letter/s/87869e/32.png) [@Selimm12](https://community.apollographql.com/u/Selimm12)
#### Post date: [April 5, 2023, 4:51am UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062/5 "2023-04-05T04:51:34Z")

</div>

Due to some protocols I am unable to share the exact URLs, however both urls

```auto
export const link="http://dummydomain/backend/graphql/graphql";
export const socketLink = "ws://dummydomain/backend/graphql/graphql"

```

are found in a separate file in my code and I’m importing them inside the file where I’m defining the client.

As for the single call, I do have only 1 `useSubscription`, but I have 3 other `useQueries` in the same page, and since queries execute before subscriptions, it is taking the first query in the page and then it stops, neither does it take the 2 other queries, nor the subscription, nor the LazyQuery.

What I get in the console when I console log `console.log({ kind, operation })` is `{kind: 'OperationDefinition', operation: 'query' }` since it’s only reading the first query run on the page. Even if I route to a different page it is not taking any queries or subscriptions or lazyqueries on that other page unless I refresh the browser entirely.

---

<div class="post-metadata">

### Author: ![jerelmiller](https://sea1.discourse-cdn.com/flex019/user_avatar/community.apollographql.com/jerelmiller/32/3314_2.png) [@jerelmiller](https://community.apollographql.com/u/jerelmiller)
#### Post date: [April 5, 2023, 6:42am UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062/6 "2023-04-05T06:42:02Z")

</div>

That is very odd. I can’t say I’ve ever seen this happen.

Since this is difficult to reproduce, it would be super helpful if you can provide a reproduction. You can use our [error template](https://github.com/apollographql/react-apollo-error-template) which includes a subscription as well. Try and replicate your code as much as possible as there could be a clue in there. Hopefully you’re able to find a way to show the bug. Thanks!

---

<div class="post-metadata">

### Author: ![Selimm12](https://avatars.discourse-cdn.com/v4/letter/s/87869e/32.png) [@Selimm12](https://community.apollographql.com/u/Selimm12)
#### Post date: [April 5, 2023, 9:20am UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062/7 "2023-04-05T09:20:09Z")

</div>

I found the problem, it was because at some point in my code, I was emptying the client and then refilling it, but I didn’t take into consideration that I had to refill it with the web socket link as well.

Thank you very much for your time!

---

<div class="post-metadata">

### Author: ![jerelmiller](https://sea1.discourse-cdn.com/flex019/user_avatar/community.apollographql.com/jerelmiller/32/3314_2.png) [@jerelmiller](https://community.apollographql.com/u/jerelmiller)
#### Post date: [April 5, 2023, 4:04pm UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062/8 "2023-04-05T16:04:20Z")

</div>

Awesome! Glad to hear you found the source of the issue!

---

<div class="post-metadata">

### Author: ![Justin\_Gonzalez](https://sea1.discourse-cdn.com/flex019/user_avatar/community.apollographql.com/justin_gonzalez/32/5359_2.png) [@Justin\_Gonzalez](https://community.apollographql.com/u/Justin_Gonzalez)
#### Post date: [February 6, 2025, 8:49pm UTC](https://community.apollographql.com/t/apollo-client-usesubscription-not-reading-correct-link/6062/9 "2025-02-06T20:49:08Z")

</div>


