AIChat 컴포넌트 — sgcHTML | eSeGeCe

AIChat

TsgcHTMLComponent_AIChat — Delphi, C++ Builder 및 .NET에서 제공자/모델 선택기, 실시간 토큰 스트리밍 및 RAG 출처 인용을 갖춘 AI 어시스턴트 채팅입니다.

TsgcHTMLComponent_AIChat

TsgcHTMLComponent_ChatBox를 OpenAI / Anthropic / Gemini 제공자 헤더, 스트리밍 응답 및 접을 수 있는 RAG 출처로 확장하는 어시스턴트 표면입니다. 제공자를 선택하고, OnChatSend를 처리한 다음, HTML 속성을 읽습니다.

컴포넌트 클래스

TsgcHTMLComponent_AIChat

렌더링

Bootstrap 5 card + 범위 지정 CSS

패밀리

채팅 및 AI

언어

Delphi, C++ Builder, .NET

생성하고, OnChatSend를 연결하고, 렌더링하기

AIProviderModelName을 선택하고, 응답을 생성하기 위해 OnChatSend를 처리한 다음, HTML을 읽습니다. 이 이벤트는 브라우저 메시지가 사용자의 Delphi, C++ Builder 또는 .NET 코드에 도달하는 방식입니다.

uses
  sgcHTML_Enums, sgcHTML_Component_AIChat;

var
  oAI: TsgcHTMLComponent_AIChat;
begin
  oAI := TsgcHTMLComponent_AIChat.Create(nil);
  try
    oAI.AIProvider := apOpenAI;
    oAI.ModelName := 'gpt-4o';
    oAI.AIName := 'Support Bot';
    oAI.SystemPrompt := 'You are a helpful assistant.';
    oAI.WelcomeMessage := 'Hi! Ask me anything.';
    oAI.StreamingEnabled := True;
    oAI.OnChatSend := DoChatSend;   // browser message -> your code

    WebModule.Response := oAI.HTML;   // Bootstrap card + AI header
  finally
    oAI.Free;
  end;
end;

// OnChatSend hands you the user message + the JSON history,
// you call your LLM and stream the answer back:
procedure TForm1.DoChatSend(Sender: TObject; const aUserMessage,
  aConversationHistory: string);
begin
  oAI.BeginStreaming;
  oAI.PushStreamChunk('Sure, ');
  oAI.PushStreamChunk('here is the answer...');
  oAI.EndStreaming;
  WebSocket.WriteData(oAI.GetStreamFragmentHTML);
end;
// includes: sgcHTML_Enums.hpp, sgcHTML_Component_AIChat.hpp

TsgcHTMLComponent_AIChat *oAI = new TsgcHTMLComponent_AIChat(NULL);
try
{
  oAI->AIProvider = apOpenAI;
  oAI->ModelName = "gpt-4o";
  oAI->AIName = "Support Bot";
  oAI->SystemPrompt = "You are a helpful assistant.";
  oAI->WelcomeMessage = "Hi! Ask me anything.";
  oAI->StreamingEnabled = true;
  oAI->OnChatSend = DoChatSend;   // browser message -> your code

  String html = oAI->HTML;   // Bootstrap card + AI header
}
__finally
{
  delete oAI;
}

// OnChatSend handler: call your LLM, then stream the reply:
void __fastcall TForm1::DoChatSend(TObject *Sender,
  const String aUserMessage, const String aConversationHistory)
{
  oAI->BeginStreaming();
  oAI->PushStreamChunk("Sure, ");
  oAI->PushStreamChunk("here is the answer...");
  oAI->EndStreaming();
}
using esegece.sgcWebSockets;

var ai = new TsgcHTMLComponent_AIChat();
ai.AIProvider = TsgcHTMLAIProvider.apOpenAI;
ai.ModelName = "gpt-4o";
ai.AIName = "Support Bot";
ai.SystemPrompt = "You are a helpful assistant.";
ai.WelcomeMessage = "Hi! Ask me anything.";
ai.StreamingEnabled = true;

// OnChatSend: browser message -> your code -> stream the reply
ai.OnChatSend += (sender, userMessage, conversationHistory) =>
{
    ai.BeginStreaming();
    ai.PushStreamChunk("Sure, ");
    ai.PushStreamChunk("here is the answer...");
    ai.EndStreaming();
};

string html = ai.HTML;   // Bootstrap card + AI header

주요 속성 및 메서드

가장 자주 사용하게 되는 멤버.

제공자 및 모델

AIProviderapOpenAI, apAnthropic, apGemini 또는 apCustom을 선택합니다. ModelName은 헤더에 레이블을 지정하고, ShowModelSelector는 이를 토글하며, AIName은 어시스턴트의 이름을 지정합니다.

대화

SystemPromptWelcomeMessage는 채팅을 초기화합니다. UserColorAIColor(둘 다 TsgcHTMLColor)는 말풍선에 색을 입힙니다. GetConversationHistoryJSON은 LLM 호출을 위한 역할/콘텐츠 배열을 반환합니다.

전송 이벤트

OnChatSend는 방문자가 전송할 때 사용자 메시지와 JSON 기록과 함께 발생합니다 — 모델을 호출하는 후크입니다. ProcessUserMessage(aMessage)는 코드에서 그 흐름을 구동합니다.

스트리밍

StreamingEnabled는 이를 켭니다. BeginStreaming, PushStreamChunk(aChunk)EndStreaming은 응답을 토큰 단위로 확장합니다. GetStreamFragmentHTML은 푸시할 htmx 조각을 반환합니다.

RAG 출처

OnRAGContext가 있는 RAGEnabled는 검색된 컨텍스트를 주입합니다. RAGDisplayMode(rdInline/rdCollapsible/rdFootnotes)와 AddAIMessageWithSources(aText, aSourcesHTML)는 인용을 렌더링합니다.

상속 및 출력

ChatBox에서: Messages, Title, Height, InputPlaceholderShowTypingIndicator. HTML은 카드 전체를 반환하고, GetLastMessageHTML은 가장 최신 말풍선만 반환합니다.

계속 살펴보기

온라인 도움말이 찱포넌트의 전체 API 참조 및 사용 가이드입니다.
모든 sgcHTML 컴포넌트60개 이상의 컴포넌트 전체 기능 매트릭스를 둘러보십시오.
무료 체험판 다운로드30일 체험판에는 60.HTML 데모 프로젝트가 포함됩니다.
가격전체 소스 코드가 포함된 Single, Team 및 Site 라이선스.

시작할 준비가 되셨습니까?

무료 체험판을 다운로드하고 Delphi, C++ Builder 및 .NET에서 웹 UI를 구축하기 시작하십시오.