Implementation:Langgenius Dify SendCompletionMessage

Knowledge Sources	Domains	Last Updated
Dify	LLM_Applications, Frontend, API	2026-02-12 00:00 GMT

Overview

Description

sendCompletionMessage is the frontend service function for sending a test completion request to the Dify debug console. It posts a message to the application's completion endpoint using Server-Sent Events (SSE) for real-time streaming of the LLM response. The function automatically sets response_mode: 'streaming' in the request body and accepts four callback functions to handle the asynchronous event stream.

This function is the core of the debug console's completion testing workflow. It uses ssePost (a specialized HTTP client that opens an SSE connection via POST) rather than a standard post call, enabling the frontend to receive and render tokens incrementally as the model generates them.

The SSE callback architecture provides four event handlers:

• onData -- Called for each chunk of generated text, enabling real-time token-by-token rendering in the UI.
• onCompleted -- Called when the full response has been generated, signaling the UI to finalize the display.
• onError -- Called when an error occurs during generation, enabling error handling and user notification.
• onMessageReplace -- Called when content moderation or post-processing replaces the original message content, ensuring the UI reflects the final approved text.

Usage

Call sendCompletionMessage from the debug console UI to test a completion-mode application. Pass the application ID, the request body containing inputs and model configuration, and the four SSE callback handlers. The function initiates a streaming response that the callbacks process asynchronously.

Code Reference

Source Location

web/service/debug.ts, lines 32-44

Signature

export const sendCompletionMessage = async (
  appId: string,
  body: Record<string, any>,
  { onData, onCompleted, onError, onMessageReplace }: {
    onData: IOnData
    onCompleted: IOnCompleted
    onError: IOnError
    onMessageReplace: IOnMessageReplace
  }
) => {
  return ssePost(`apps/${appId}/completion-messages`, {
    body: {
      ...body,
      response_mode: 'streaming',
    },
  }, { onData, onCompleted, onError, onMessageReplace })
}

Import

import { sendCompletionMessage } from '@/service/debug'

I/O Contract

Inputs

Parameter	Type	Required	Description
appId	string	Yes	The application ID to test.
body	Record<string, any>	Yes	The request payload, typically containing inputs (variable values), query (user question), model_config (current model configuration), and completion_params (inference parameters).
onData	IOnData	Yes	Callback invoked for each chunk of streaming text data. Receives the text chunk and allows progressive rendering.
onCompleted	IOnCompleted	Yes	Callback invoked when the streaming response is complete. Receives the final aggregated response.
onError	IOnError	Yes	Callback invoked when an error occurs during streaming. Receives the error details.
onMessageReplace	IOnMessageReplace	Yes	Callback invoked when content moderation replaces the message text. Receives the replacement content.

Key properties within the body payload:

Property	Type	Description
inputs	Record<string, string>	Key-value pairs of prompt variable values.
query	string	The user's input query or question.
model_config	ModelConfig	The current model and prompt configuration.
completion_params	CompletionParams	Inference parameters: max_tokens, temperature, top_p, presence_penalty, frequency_penalty.
response_mode	'streaming'	Automatically set to 'streaming' by the function. This activates SSE-based incremental response delivery.

Outputs

The function does not return a data payload directly. Instead, responses are delivered asynchronously through the SSE callbacks:

Callback	Invocation	Data Shape
onData	Per streaming chunk	Text chunk string with incremental content from the LLM.
onCompleted	Once, on stream completion	Final response metadata including message ID and full text.
onError	On error	Error object with error code and message.
onMessageReplace	On content replacement	Replacement message content from moderation or post-processing.

Usage Examples

Sending a completion test message with streaming callbacks

import { sendCompletionMessage } from '@/service/debug'

let fullResponse = ''

await sendCompletionMessage(
  'app-id-123',
  {
    inputs: { domain: 'machine learning' },
    query: 'Explain gradient descent in simple terms.',
    model_config: currentModelConfig,
    completion_params: {
      max_tokens: 1024,
      temperature: 0.7,
      top_p: 0.95,
      presence_penalty: 0.0,
      frequency_penalty: 0.0,
    },
  },
  {
    onData: (message: string) => {
      fullResponse += message
      // Update UI with incremental text
      updateDebugConsole(fullResponse)
    },
    onCompleted: () => {
      // Mark generation as complete in the UI
      setGenerating(false)
    },
    onError: (error) => {
      console.error('Completion error:', error)
      showErrorNotification(error.message)
    },
    onMessageReplace: (replacement: string) => {
      // Content moderation replaced the message
      fullResponse = replacement
      updateDebugConsole(fullResponse)
    },
  },
)

Related Pages

• Principle:Langgenius_Dify_Debug_Console_Testing