microsoft/BotFramework-WebChat

Bot Framework Web Chat란 무엇인가요?

Bot Framework Web Chat는 즉시 사용 가능하고 고도로 사용자 정의 가능한 웹 UI 로, Microsoft Bot Framework 봇을 어떤 웹사이트에도 쉽게 통합할 수 있게 해줍니다. 이 UI는 Bot Framework의 Direct Line(및 Direct Line Speech) 채널 위에 구축되어 있으며, UI 처리, 활동 렌더링, 파일 업로드, 음성, 어댑티브 카드, 기타 대화 기능을 처리합니다. 개발자는 봇의 로직에만 집중할 수 있습니다.

누구에게 적합한가요?

UI를 처음부터 구축하지 않고도 웹사이트에 채팅 창을 추가하고 싶은 웹 개발자.
Azure Bot Service에서 봇을 만들고 보안이 강화된, 통합 가능한 프론트엔드가 필요한 봇 제작자.
채팅 테마(플루언트 UI 테마 포함)를 맞춤 설정하거나 React 컴포넌트로 UI 일부를 교체하고 싶은 제품 팀.

핵심 기능 (README에 설명된 내용)

기능	의미
Direct Line 통합	봇의 비밀 키에서 생성된 토큰을 통해 UI와 봇을 연결합니다.
Direct Line Speech	Azure Speech Services를 사용한 내장 음성 인식/음성 합성 기능.
라이브 스트리밍 응답	봇이 응답을 생성하는 도중 부분적인 답변을 스트리밍할 수 있습니다.
Adaptive Cards v1.6	풍부한 카드 UI를 렌더링합니다. `adaptiveCardsParserMaxVersion`를 통해 버전 제한 가능.
테마 팩	스타일 맞춤 설정 세트를 NPM 패키지로 배포할 수 있습니다. 실험적 플루언트 UI 테마 팩은 Copilot 스타일의 외관을 모방합니다.
Markdown 내 HTML	Markdown에 안전한 HTML을 포함할 수 있습니다. `styleOptions.markdownRenderHTML`로 비활성화 가능.
접근성	시각적 포커스 표시, ARIA 지원, 전용 접근성 가이드 제공.
사용자 정의	CDN 번들(간단한 CSS/JS) 또는 React 패키지(전체 컴포넌트 재구성, 커스텀 렌더러, Redux DevTools)를 통해 가능.
브라우저 지원	최신 두 버전의 Chrome, Edge, Firefox를 지원합니다. v4.16 이후부터 IE 11 지원 종료.
보안	Content-Security-Policy 권장. 봇 비밀을 공개하는 대신 토큰 기반 인증을 권장합니다.

시작하기 (README에서 요약한 단계)

Azure Bot Service에서 봇 생성.
Azure 포털에서 Web Chat 비밀을 가져와서 Direct Line 토큰으로 교환.
스크립트 추가(또는 NPM 패키지 설치).
WebChat.renderWebChat({ directLine: WebChat.createDirectLine({ token }) }, element) 호출 (또는 React의 <ReactWebChat> 컴포넌트 사용).
선택적으로 색상, 크기, CSS, 또는 React API를 통해 컴포넌트 교체.

더 많은 정보 찾기

CHANGELOG.md – 버전별 상세 변경 사항.
docs/ – API 참조, 마이그레이션 가이드, 접근성, 로컬라이제이션, 텔레메트리, 음성 문서.
samples/ – CDN 번들, React 호스트, ES5 번들, 커스텀 테마 팩용 사전 준비된 예제.
NPM – 패키지 botframework-webchat (전체 기능 번들) 및 botframework-webchat-fluent-theme (플루언트 UI 테마용).

TL;DR

Bot Framework Web Chat는 Microsoft가 유지 관리하는, Azure Bot Framework 봇용 프로덕션 수준의 웹 클라이언트입니다. 기본 UI, 음성, 어댑티브 카드, 테마, 깊이 있는 React 수준의 사용자 정의를 제공하며, 보안이 강화된 토큰 기반 인증과 최신 브라우저 사용을 장려합니다.