mh15M
tRPC9mo ago
3 replies
mh15

SSE issue with CORS and Fastify

Hello, I've followed the guidelines here (https://trpc.io/docs/server/subscriptions) but my useSubscription calls don't go through. Thoughts?

const server = fastify({
  maxParamLength: 5000,
});
await server.register(cors, {
  origin: (origin, cb) => {
    console.log(`CORS origin check: ${origin}`);
    cb(null, true);
    // const hostname = new URL(origin).hostname
    // if(hostname === "localhost"){
    //   //  Request from localhost will pass
    //   return
    // }
    // // Generate an error on other origins, disabling access
    // cb(new Error("Not allowed"), false)
  },
  methods: ["GET", "POST", "OPTIONS"],
  allowedHeaders: ["Content-Type", "Authorization", "Accept"],
  credentials: true,
  preflightContinue: false,
  optionsSuccessStatus: 204,
});

server.register(fastifyTRPCPlugin, {
  prefix: "/trpc",
  trpcOptions: {
    router: appRouter,
    onError({ path, error }) {
      // report to error monitoring
      console.error(`Error in tRPC handler on path '${path}':`, error);
    },
  } satisfies FastifyTRPCPluginOptions<AppRouter>["trpcOptions"],
});


and the client
trpc.createClient({
      links: [
        splitLink({
          condition: (op) => op.type === "subscription",
          true: httpSubscriptionLink({
            url: `${env.VITE_API_URL}/trpc`,
            transformer: new superjson(),
            eventSourceOptions() {
              return {
                withCredentials: true, // <---
              };
            },
          }),
          // TODO: swap back to httpBatchLink for perf in production
          false: httpLink({
            url: `${env.VITE_API_URL}/trpc`,
            // You can pass any HTTP headers you wish here
            // async headers() {
            //   return {
            //     authorization: getAuthCookie(),
            //   };
            // },
            transformer: new superjson(),
          }),
        }),
      ],
    })
Was this page helpful?