Forward NextJs Request to TRPC Server

import { createTRPCReact } from "@trpc/react-query";
// ...Imports...
import { type AppRouter } from "@acme/trpc"; // Internal Package of Monorepo

export const trpcClient = createTRPCReact<AppRouter>();

export const queryClient = new QueryClient();

export default function TRPCProvider({ children }: { children: React.ReactNode }) {
  const [client] = useState(() =>
    trpcClient.createClient({
      links: [
        httpBatchLink({
          url: `/api/trpc`,
        }),
      ],
    }),
  );
  return (
    <trpcClient.Provider client={client} queryClient={queryClient}>
      <QueryClientProvider client={queryClient}>
        {children}
        <ReactQueryDevtools initialIsOpen={false} />
      </QueryClientProvider>
    </trpcClient.Provider>
  );
}

import { createTRPCReact } from "@trpc/react-query";
// ...Imports...
import { type AppRouter } from "@acme/trpc"; // Internal Package of Monorepo

export const trpcClient = createTRPCReact<AppRouter>();

export const queryClient = new QueryClient();

export default function TRPCProvider({ children }: { children: React.ReactNode }) {
  const [client] = useState(() =>
    trpcClient.createClient({
      links: [
        httpBatchLink({
          url: `/api/trpc`,
        }),
      ],
    }),
  );
  return (
    <trpcClient.Provider client={client} queryClient={queryClient}>
      <QueryClientProvider client={queryClient}>
        {children}
        <ReactQueryDevtools initialIsOpen={false} />
      </QueryClientProvider>
    </trpcClient.Provider>
  );
}

import type { AppRouter } from "@acme/trpc"; // Internal Package

export const createTrpcServer = () => createTRPCProxyClient<AppRouter>({
  links: [
    httpBatchLink({
      url: `${CONFIG.TRPC_BACKEND}/trpc`,
      headers: {
        ...Object.fromEntries(headers().entries()),
      },
    }),
  ]
});

export const trpcServer = createTrpcServer();

import type { AppRouter } from "@acme/trpc"; // Internal Package

export const createTrpcServer = () => createTRPCProxyClient<AppRouter>({
  links: [
    httpBatchLink({
      url: `${CONFIG.TRPC_BACKEND}/trpc`,
      headers: {
        ...Object.fromEntries(headers().entries()),
      },
    }),
  ]
});

export const trpcServer = createTrpcServer();

const handler = async (req: Request) => {
  const body = await req.text();
  const path = req.url.split("/api/trpc/")[1]; // taking the second half
  const url = `${process.env.TRPC_SERVER}/trpc/${path}`

  const headers = req.headers;
  console.log("ROUTE", { body, url, headers });

  const response = await fetch(url, {
    method: req.method,
    headers: req.headers,
    // GET and HEAD can't have a body
    body: req.method === "GET" ||
      req.method === "HEAD" ?
      null : body,
  });
  return new Response(response.body, {
    status: response.status,
    headers: response.headers,
  })
};

export { handler as GET, handler as POST };

const handler = async (req: Request) => {
  const body = await req.text();
  const path = req.url.split("/api/trpc/")[1]; // taking the second half
  const url = `${process.env.TRPC_SERVER}/trpc/${path}`

  const headers = req.headers;
  console.log("ROUTE", { body, url, headers });

  const response = await fetch(url, {
    method: req.method,
    headers: req.headers,
    // GET and HEAD can't have a body
    body: req.method === "GET" ||
      req.method === "HEAD" ?
      null : body,
  });
  return new Response(response.body, {
    status: response.status,
    headers: response.headers,
  })
};

export { handler as GET, handler as POST };

  response.cookies.set("lat", latParam)
  response.cookies.set("lng", lngParam)

  response.cookies.set("lat", latParam)
  response.cookies.set("lng", lngParam)

import { httpBatchLink } from "@trpc/client"
import { createTRPCNext } from "@trpc/next"
import superjson from "superjson"

import { AppRouter } from "../../../apis/src/router"
import { getBaseUrl } from "./utils"
import { ENV } from "./env"

export const trpc = createTRPCNext<AppRouter>({
  config(opts) {
    const { ctx } = opts
    return {
      transformer: superjson, // optional - adds superjson serialization
      links: [
        httpBatchLink({
          fetch(url, options) {
            return fetch(url, {
              ...options,
              credentials: "include",
            })
          },
          // The server needs to know your app's full url
          // url: `${getBaseUrl()}/api/trpc`,
          url: ENV.BASE_URL,
          headers() {
            return {
              ...(typeof window === "undefined"
                ? {
                    ...ctx?.req?.headers,
                    cookie: ctx?.req?.headers?.cookie,
                  }
                : {}),
              "Content-Type": "application/json",
              accept: "application/json",
              "accept-encoding": "gzip, deflate, br",
              platform: "web",
            }
          },
        }),
      ],
    }
  },
  ssr: true,
}

import { httpBatchLink } from "@trpc/client"
import { createTRPCNext } from "@trpc/next"
import superjson from "superjson"

import { AppRouter } from "../../../apis/src/router"
import { getBaseUrl } from "./utils"
import { ENV } from "./env"

export const trpc = createTRPCNext<AppRouter>({
  config(opts) {
    const { ctx } = opts
    return {
      transformer: superjson, // optional - adds superjson serialization
      links: [
        httpBatchLink({
          fetch(url, options) {
            return fetch(url, {
              ...options,
              credentials: "include",
            })
          },
          // The server needs to know your app's full url
          // url: `${getBaseUrl()}/api/trpc`,
          url: ENV.BASE_URL,
          headers() {
            return {
              ...(typeof window === "undefined"
                ? {
                    ...ctx?.req?.headers,
                    cookie: ctx?.req?.headers?.cookie,
                  }
                : {}),
              "Content-Type": "application/json",
              accept: "application/json",
              "accept-encoding": "gzip, deflate, br",
              platform: "web",
            }
          },
        }),
      ],
    }
  },
  ssr: true,
}

response.cookies.set(“lat”, latParam, {
sameSite: “none”,
secure: true})

response.cookies.set(“lat”, latParam, {
sameSite: “none”,
secure: true})