跨來源發送 Cookie

如果您的 API 位於與您的前端不同的來源，而且您希望傳送 Cookie 給它，您需要在您的伺服器上啟用 CORS，並透過提供選項 {credentials: "include"} 給 fetch 來傳送 Cookie 和您的要求。

tRPC 使用的 fetch 函數所提供的引數可以修改如下。

app.ts
ts
import { createTRPCClient, httpBatchLink } from '@trpc/client';
const client = createTRPCClient<AppRouter>({
  links: [
    httpBatchLink({
      url: 'YOUR_SERVER_URL',
      fetch(url, options) {
        return fetch(url, {
          ...options,
          credentials: 'include',
        });
      },
    }),
  ],
});

app.ts
ts
import { createTRPCClient, httpBatchLink } from '@trpc/client';
const client = createTRPCClient<AppRouter>({
  links: [
    httpBatchLink({
      url: 'YOUR_SERVER_URL',
      fetch(url, options) {
        return fetch(url, {
          ...options,
          credentials: 'include',
        });
      },
    }),
  ],
});

資訊

您也需要在您的伺服器上啟用 CORS，方法是修改您的 轉接器，或您的 API 前端的 HTTP 伺服器。最佳方法會依轉接器而異，並根據您的主機架構而定，而且個別轉接器通常會記錄此程序（如果適用）。