본문으로 건너뛰기

배포 ID를 활용한 에러 추적 패턴

에러 리포트에 배포 ID를 첨부하면 "어느 빌드에서 발생했는가"를 즉시 알 수 있다. 배포 ID는 미니앱 빌드마다 발급되는 고유 문자열이다.

에러 리포트에 배포 ID 포함하기​

import { env } from '@apps-in-toss/web-framework';
import { useEffect } from 'react';

function App() {
  useEffect(() => {
    const deploymentId = env.getDeploymentId();

    const handler = (event: PromiseRejectionEvent) => {
      // 에러 로그에 배포 ID를 포함해 어느 빌드에서 발생했는지 추적합니다.
      console.error('[unhandled]', {
        deploymentId,
        reason: event.reason,
      });
    };

    window.addEventListener('unhandledrejection', handler);
    return () => window.removeEventListener('unhandledrejection', handler);
  }, []);

  return <main>{/* 앱 콘텐츠 */}</main>;
}

env.getDeploymentId()는 동기이므로 렌더 전에 한 번 읽어 캐싱하면 충분하다. 이벤트 핸들러마다 호출할 필요 없다.

외부 에러 수집 서비스에 연동하기​

import { env } from '@apps-in-toss/web-framework';

const deploymentId = env.getDeploymentId();

// Sentry 또는 유사 SDK 초기화 시 태그로 등록
// (Sentry SDK가 프로젝트에 설치된 경우 예시)
// Sentry.setTag('deploymentId', deploymentId);

// 또는 fetch 기반 수집 엔드포인트로 전송
async function reportError(error: unknown): Promise<void> {
  await fetch('/api/errors', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ deploymentId, error: String(error) }),
  });
}
  • deploymentId를 컨텍스트 태그로 등록하면 여러 에러를 동일 빌드로 묶어 볼 수 있다.
  • 필요에 따라 getOperationalEnvironment()를 함께 포함하면 프로덕션 / 샌드박스 분류도 가능하다.

관련 API​