Headers & Autenticação de Sessão

O código abaixo de HeaderStore, headersProvider e sessionAuth não é um exemplo de arquivos independentes, mas explica partes do adaptador HTTP compartilhado do projeto (rxjsHttpService.ts/commonService.ts). Se você quiser ver a estrutura completa do arquivo, verifique o código completo do HTTP Client em sua forma mínima e expandida antes de ler esta página.

Cabeçalhos que precisam ser usados por vários serviços, como o token de acesso recebido após o login,HeaderStorepodem ser armazenados em.

import { createHeaderStore } from "@byeolnaerim/typed-rx-http";

export const headerStore = createHeaderStore({
  "Content-Type": "application/json",
});

headerStore.merge({
  Authorization: `Bearer ${accessToken}`,
});

headerStore.remove("Authorization");

O Componente do Cliente lê o HeaderStore, enquanto o Componente do Servidor lê os cookies. headersProviderpode ser criado. Nesta função, você pode separar a forma de consulta de headers entre CSR e SSR em um único lugar.

const headersProvider = async () => {
  if (typeof window !== "undefined") {
    return headerStore.get();
  }

  const { cookies } = await import("next/headers");
  const accessToken = (await cookies()).get("accessToken")?.value;

  return accessToken
    ? { Authorization: `Bearer ${accessToken}` }
    : {};
};

export const service = createHttpClient<paths>({
  baseUrl: process.env.NEXT_PUBLIC_API_URL || "",
  headerStore,
  headersProvider,
});

Não modifique os serviços gerados automaticamente um a um, mas adicione um operador de sessão aocallApiserviço público. Assim, todos os serviços gerados usarão as mesmas regras de busca e refresh de token.

import { createSessionAuth } from "@byeolnaerim/typed-rx-http";
import { defer } from "rxjs";

const sessionAuth = createSessionAuth({
  headerStore,
  tokenUrl: "/api/auth/token",
  refreshUrl: "/api/auth/token/refresh",
  logoutUrl: "/api/auth/logout",
  onLoginChange: (loggedIn) => setLogin(loggedIn),
});

export const callApi = (serviceArguments) =>
  defer(() => service.callApi(serviceArguments)).pipe(
    sessionAuth.withSessionAuth(),
  );

Se não houver autorização, verifique primeiro o endpoint do token e, se a solicitação original for 401, faça uma nova solicitação após o refresh. Se o refresh também falhar, chame o endpoint de logout e passe o erro original.

Para sincronizar apenas o token antes da requisição sem usar refresh/retry 401, use withEnsureToken().

return client.callApi(...).pipe(
  auth.withEnsureToken(),
);

export const { callApi, callApiStream } = createHttpClient<paths>({
  baseUrl: "/api",
});

APIs públicas ou projetos simples são suficientes. HeaderStore e autenticação de sessão não são estruturas obrigatórias.