TRPC URL should be relative by default

[cawa-93]

export default defineNuxtConfig({
  trpc: {
    baseURL: 'http://localhost:3000/', // <--
    trpcURL: '/api/trpc',
  },
})

This does not allow you to change the URI to the server depending on the environment.

• Port 3000 may be busy and nuxt will start on port 3001, or 3002, or 3003 ...
• You open dev server by IP
• The application can be deployed on different servers for testing. It is not always known in advance on which host, port, protocol it will work.

In all these cases, the use of the absolute URL http://localhost:3000/api/trpc as default leads to problems. The default URL must be relative /api/trpc to make calls to the current host, no matter what it is.

[wobsoriano]

I'm looking at a way to get the baseURL automatically, like how useFetch does

[cawa-93]

Another use case: We have an application that runs under multiple domains: example1.com and example2.com. The need to define an absolute base address leads to the fact that the api is not available on one of the domains. If you set baseURL: 'https://example1.com/' then on example2.com client will still try to connect to https://example1.com. Client make preflight requests and it failed because OPTION method not allowed

[cawa-93]

Probably it may fixed by replace fetch implementation to $fetch

trpc.createTRPCClient({
    fetch(...args) {
      return globalThis.$fetch(...args).then(d => ({json: () => Promise.resolve(d)}))
    }
})

With these changes, a relative path configuration works for me

export default defineNuxtConfig({
  trpc: {
    baseURL: '',
  },
})

Theoretically, this should also work.

trpc.createTRPCClient({
    fetch: globalThis.$fetch.raw,
})

However, it doesn't work 🤷‍♂️ I get the error:

TRPCClientError: body used already for:
    at Function.from (file:///home/cawa-93/dev/kitlink/.nuxt/dist/server/server.mjs:11569:14)
    at file:///home/cawa-93/dev/kitlink/.nuxt/dist/server/server.mjs:12190:42
    at processTicksAndRejections (node:internal/process/task_queues:96:5) {
  originalError: TypeError: body used already for:
      at consumeBody (file:///home/cawa-93/dev/kitlink/node_modules/node-fetch-native/dist/chunks/abort-controller.mjs:4955:9)
      at Response.text (file:///home/cawa-93/dev/kitlink/node_modules/node-fetch-native/dist/chunks/abort-controller.mjs:4917:24)
      at Response.json (file:///home/cawa-93/dev/kitlink/node_modules/node-fetch-native/dist/chunks/abort-controller.mjs:4907:27)
      at file:///home/cawa-93/dev/kitlink/.nuxt/dist/server/server.mjs:12333:18
      at processTicksAndRejections (node:internal/process/task_queues:96:5),
  shape: undefined,
  data: undefined,
  isDone: false,
  [cause]: TypeError: body used already for:
      at consumeBody (file:///home/cawa-93/dev/kitlink/node_modules/node-fetch-native/dist/chunks/abort-controller.mjs:4955:9)
      at Response.text (file:///home/cawa-93/dev/kitlink/node_modules/node-fetch-native/dist/chunks/abort-controller.mjs:4917:24)
      at Response.json (file:///home/cawa-93/dev/kitlink/node_modules/node-fetch-native/dist/chunks/abort-controller.mjs:4907:27)
      at file:///home/cawa-93/dev/kitlink/.nuxt/dist/server/server.mjs:12333:18
      at processTicksAndRejections (node:internal/process/task_queues:96:5)
}

I could not determine its origin and how to fix it