chat

chat이란?

chat은 서비스의 MCP 서버와 연동되도록 설계된 범용 AI 채팅 클라이언트입니다. 외부 MCP 서버에 연결하여 자연어 인터페이스로 도구와 상호작용할 수 있으며, 도메인(예: 배송, 예약, 작업 관리)에 관계없이 사용 가능합니다.

이 프로젝트는 Next.js App Router 애플리케이션으로 구축되었으며, 채팅 경험에 필요한 실용적인 UI와 통합 세부 사항에 중점을 둡니다: MCP를 통한 도구 연결, 스트리밍 응답, 메시지 기록, 이미지 입력과 같은 멀티모달 콘텐츠 및 Markdown 기반 어시스턴트 출력 지원.

주요 기능

Streamable HTTP를 통한 MCP 도구 통합: 하나의 외부 MCP 서버에 연결하며, MCP_URL(모든 백엔드) 또는 MCP_APPS_URL(TypeScript + 임베디드 UI) 중 하나로 설정; 런타임에서 둘 다 설정 시 거부.
실시간 타이핑 인디케이터와 함께 스트리밍 AI 응답: 어시스턴트 출력은 한 번에 반환되지 않고 생성되는 대로 스트리밍.
어시스턴트 메시지의 Markdown 렌더링: 테이블, 목록, 코드 블록, 링크를 포함한 Markdown으로 어시스턴트 메시지 렌더링.
전송 전 크롭 기능의 이미지 첨부: 사용자가 이미지를 첨부하면 전송 전에 크롭 프롬프트가 표시되며, 전송 시에만 압축 및 업로드(조기 업로드 방지).
LLM 이미지 출력 지원: 어시스턴트가 ![alt](url)와 같은 표준 Markdown 구문을 사용해 응답에 이미지를 포함; 이미지는 지연 로딩 스켈레톤이 있는 정사각형 카드로 표시되며 클릭 시 전체 크기로 열림.
커서 기반 페이지네이션의 대화 기록: 무한 스크롤 동작으로 페이지 단위로 지속적인 채팅 기록 검색.
인증 및 지역화 지원: 이메일/비밀번호(인증, 재설정) 및 Google OAuth; IP 지오로케이션(IPinfo Lite) 기반 로케일 감지(Accept-Language 대체)와 사용자 설정으로 오버라이드 가능.

chat 사용 방법

애플리케이션 실행(필수 조건 확인)하고 프로젝트 루트에 .env.local 파일 생성.
MCP_URL 또는 MCP_APPS_URL 중 하나로 MCP 연결 설정(하나만 선택). 선택적으로 NEXT_PUBLIC_APP_NAME 및 APP_PERSONA_CONTEXT와 같은 브랜딩 및 페르소나 컨텍스트 변수 설정.
지원되는 인증 방법으로 로그인.
채팅 UI에서 대화 시작. 어시스턴트는 MCP 서버에서 노출된 도구를 호출하며 응답 스트리밍 가능.
메시지 제한(WEEKLY_MESSAGE_LIMIT) 활성화 시, 남은 할당량이 적으면 UI에 경고 표시하고 소진 시 추가 전송 차단.

사용 사례

배송 또는 배차 어시스턴트: 배송 관련 MCP 서버 연결로 사용자 요청 조정 및 대화형 워크플로우 추적 지원.
잡역부 예약: 잡역부 예약 MCP 서버 연결로 어시스턴트가 작업 안내 및 도구 호출로 세부 정보 수집.
작업 관리 인터페이스: 작업 관리 MCP 서버를 사용해 자연어를 백엔드 작업으로 변환.
이미지 기반 멀티모달 지원: 이미지 업로드(전송 전 크롭) 후 어시스턴트에게 분석 또는 워크플로우 통합 요청; 어시스턴트 응답에 이미지 카드 포함 지원.
팀을 위한 다국어 지원: 내장 로케일 감지 및 커스텀 i18n 시스템으로 EN, ID, KR, JP, ES, ZH, DE, NL, FR, IT 등의 UI 문자열과 AI 시스템 프롬프트 지역화.

자주 묻는 질문

앱이 지원하는 MCP 구성은?

하나의 MCP 서버 연결 지원. MCP_URL 또는 MCP_APPS_URL 중 하나 사용. 둘 다 설정 시 런타임에서 거부.

UI에서 AI 응답은 어떻게 전달되나요?

실시간 스트리밍으로 전달되며, 생성 중 타이핑 인디케이터 표시.

사용자가 이미지를 보낼 수 있고, 어시스턴트가 이미지를 표시할 수 있나요?

네. 사용자는 전송 전 크롭 흐름으로 이미지 첨부; 메시지 전송 시에만 압축 및 업로드. 어시스턴트는 Markdown 이미지 구문으로 응답에 이미지 포함 가능.

chat 기록이 저장되나요?

네. 지속적인 대화 기록 유지하며, 무한 스크롤의 커서 기반 페이지네이션 사용.

메시지 전송 수에 제한이 있나요?

선택적으로 WEEKLY_MESSAGE_LIMIT으로 사용자별 주간 제한 설정 가능. 활성화 시 남은 횟수가 적으면 UI 경고, 소진 시 429 차단 반환.

대안

MCP 도구 통합이 없는 일반 AI 채팅 웹 앱: 프롬프트 기반 채팅에 초점을 맞추지만, 서비스 백엔드에 대한 구조화된 도구 프로토콜 연결을 제공하지 않습니다.
사용자 지정 MCP 클라이언트 구현 (다른 UI/스택): MCP 도구 호출을 위한 다른 클라이언트를 만들 수 있지만, 워크플로와 기능(이미지 처리, 메시지 기록, 현지화)이 다를 수 있습니다.
도구 호출 대신 검색 중심 RAG/채팅 솔루션: 지식 검색과 문서 기반에 초점을 맞추며, MCP 도구를 통한 작업 조율 대신 사용합니다.
범용 멀티모달 채팅 인터페이스: 이미지 입력/출력을 지원하지만, 외부 서비스 도구 연결을 위한 동일한 MCP 기반 워크플로를 포함하지 않을 수 있습니다.