score:0

Accepted answer

basically as i thought, impl was not needed because native html5 websocket can be used, problem was trash nextjs with it's server side thing.

i pretty much don't use that exchange when typeof window !== 'undefined' this is the working code:

import { createclient, dedupexchange, cacheexchange, subscriptionexchange, client, exchange } from 'urql';
import { multipartfetchexchange } from '@urql/exchange-multipart-fetch';
import { createclient as createwsclient } from 'graphql-ws';

export const createurqlclient = (): client => {
  const graphqlendpoint = process.env!.next_public_graphql_endpoint as string;
  const graphqlwebsocketendpoint = process.env!.next_public_graphql_ws_endpoint as string;

  let exchanges: exchange[] | undefined = [dedupexchange, cacheexchange, multipartfetchexchange];

  if (typeof window !== 'undefined') {
    const wsclient = createwsclient({
      url: graphqlwebsocketendpoint,
    });

    const subexchange = subscriptionexchange({
      forwardsubscription: operation => ({
        subscribe: sink => ({
          unsubscribe: wsclient.subscribe(operation, sink),
        }),
      }),
    });

    exchanges.push(subexchange);
  }

  const client = createclient({
    url: graphqlendpoint,
    requestpolicy: 'cache-and-network',
    exchanges,
    fetchoptions: () => ({
      credentials: 'include',
    }),
  });

  return client;
};


Related Query

More Query from same tag