tRPC Cors Authentication Error

Hey, I was mainly looking to enable CORS locally for calling my tRPC endpoints in localhost:3000 (NextJS) from localhost:6006 (Storybook)

I followed this doc https://trpc.io/docs/cors and this section of the advanced usage to enable cors https://trpc.io/docs/api-handler#advanced-usage but I'm getting the following error CORS No Allow Credentials - Removing the credentials: include fixes this https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Credentials however then I'm unable to use authenticated endpoints

What I'm looking to do is call my authed endpoints on localhost:3000 from localhost:6000, has anyone had experience with this?

Relevant repository code:

Next - https://github.com/AnswerOverflow/AnswerOverflow/tree/message-result-page/apps/nextjs

Storybook - https://github.com/AnswerOverflow/AnswerOverflow/tree/message-result-page/packages/ui

  res.setHeader("Access-Control-Allow-Origin", "http://localhost:6006");
  res.setHeader("Access-Control-Request-Method", "*");
  res.setHeader("Access-Control-Allow-Methods", "OPTIONS, GET");
  res.setHeader("Access-Control-Allow-Headers", "content-type");
  res.setHeader("Referrer-Policy", "no-referrer");
  res.setHeader("Access-Control-Allow-Credentials", "true");

Changing my headers to be these (updating allow-headers and allow-origin) allowed the authentication to get through

Gotta update my code to make sure this is dev only now - Is this something that should be updated on the documentation? I can make a PR if so

When I followed that setup it threw some errors at me

First it was that using a wildcard * for access control allow origin doesn’t work with sending cookies for auth it fails

Next it failed since it didn’t have access-control-allow-headers set to true

Then it failed since it didn’t have the access-control-allow-headers set to content type

That’s what I’m wondering if needs to be updated in the docs as the docs recommend using wildcards there but that fails to do with

The CORS docs aren’t wrong and that setup does work if you’re not doing authed endpoints but where it fails is when you call endpoints that need to read the auth cookies

I'll make a PR - good to know other people are encountering it