DevUI

DevUI är ett enkelt, fristående exempelprogram för att köra agenter och arbetsflöden i Microsoft Agent Framework. Det tillhandahåller ett webbgränssnitt för interaktiv testning tillsammans med en OpenAI-kompatibel API-serverdel, så att du visuellt kan felsöka, testa och iterera på agenter och arbetsflöden som du skapar innan du integrerar dem i dina program.

Important

DevUI är en exempelapp som hjälper dig att visualisera och felsöka dina agenter och arbetsflöden under utvecklingen. Den är inte avsedd för produktionsanvändning.

Installera programvarupaketen

Installera DevUI-paketet för en enda .NET-tjänst. För en Aspire AppHost som aggregerar flera agenttjänster installerar du även Aspire-värdintegrering.

dotnet add package Microsoft.Agents.AI.DevUI --prerelease
dotnet add package Aspire.Hosting.AgentFramework.DevUI --prerelease

Använda DevUI med Aspire

Varje agenttjänst exponerar OpenAI-svar och konversationsslutpunkter. Aspire AppHost lägger till en DevUI-resurs och ansluter agenttjänsterna.

var writerAgent = builder.AddProject<Projects.WriterAgent>("writer-agent", launchProfileName: "https")
    .WithHttpHealthCheck("/health", endpointName: "https")
    .WithReference(foundry).WaitFor(foundry);

// Add the editor agent service
var editorAgent = builder.AddProject<Projects.EditorAgent>("editor-agent")
    .WithHttpHealthCheck("/health")
    .WithReference(foundry).WaitFor(foundry);

// Add DevUI integration that aggregates agents from all agent services.
// Agent metadata is declared here so backends don't need a /v1/entities endpoint.
_ = builder.AddDevUI("devui")
    .WithAgentService(writerAgent, agents: [new("writer")]) // the name of the agent should match the agent declaration in WriterAgent/Program.cs
    .WithAgentService(editorAgent, agents: [new("editor")]) // the name of the agent should match the agent declaration in EditorAgent/Program.cs
    .WaitFor(writerAgent)
    .WaitFor(editorAgent);

Namnen agents: som skickas till WithAgentService måste matcha de namn som registrerats av AddAIAgent(...) i varje tjänst.

Exponera agentens tjänstslutpunkter


var builder = WebApplication.CreateBuilder(args);

builder.AddServiceDefaults();

builder.AddAzureChatCompletionsClient(connectionName: "foundry",
    configureSettings: settings =>
        {
            // WARNING: DefaultAzureCredential is convenient for development but requires careful consideration in production.
            // In production, consider using a specific credential (e.g., ManagedIdentityCredential) to avoid
            // latency issues, unintended credential probing, and potential security risks from fallback mechanisms.
            settings.TokenCredential = new DefaultAzureCredential();
            settings.EnableSensitiveTelemetryData = builder.Environment.IsDevelopment();
        })
    .AddChatClient("gpt41");

builder.AddAIAgent("writer", "You write short stories (300 words or less) about the specified topic.");

// Register services for OpenAI responses and conversations
builder.Services.AddOpenAIResponses();
builder.Services.AddOpenAIConversations();

var app = builder.Build();

app.UseHttpsRedirection();

// Map OpenAI API endpoints — DevUI aggregator routes requests here

DevUI-aggregatorn kombinerar entiteter från alla konfigurerade tjänster och dirigerar svars- och konversationsförfrågningar till rätt serverdel.

DevUI-instrumentpanel för Agent Framework som visar agentkatalog och spårning

Features

  • Webbgränssnitt: Interaktivt användargränssnitt för testning av agenter och arbetsflöden
  • Flexibla indatatyper: Stöd för text, filuppladdningar och anpassade indatatyper baserat på arbetsflödets första köre
  • Directory-Based Identifiering: Identifiera agenter och arbetsflöden automatiskt från en katalogstruktur
  • In-Memory-Registrering: Registrera entiteter genom programkod utan konfiguration av filsystemet
  • OpenAI-Compatible API: Använd OpenAI Python SDK för att interagera med dina agenter
  • Exempelgalleri: Bläddra bland och ladda ned utvalda exempel när inga entiteter identifieras
  • Spårning: Visa OpenTelemetry-spårningar för felsökning och observerbarhet

Indatatyper

DevUI anpassar sitt indatagränssnitt baserat på entitetstypen:

  • Agenter: Stöd för textinmatning och bifogade filer (bilder, dokument osv.) för multimodala interaktioner
  • Arbetsflöden: Indatagränssnittet genereras automatiskt baserat på den första körens indatatyp. DevUI introspektar arbetsflödet och återspeglar det förväntade indataschemat, vilket gör det enkelt att testa arbetsflöden med strukturerade eller anpassade indatatyper.

Med den här dynamiska indatahanteringen kan du testa dina agenter och arbetsflöden precis som de skulle få indata i ditt program.

Installation

Installera DevUI från PyPI:

pip install agent-framework-devui --pre

Snabbstart

Alternativ 1: Programmatisk registrering

Starta DevUI med agenter som är registrerade i minnet:

from agent_framework import Agent
from agent_framework.openai import OpenAIChatClient
from agent_framework.devui import serve

def get_weather(location: str) -> str:
    """Get weather for a location."""
    return f"Weather in {location}: 72F and sunny"

# Create your agent
agent = Agent(
    name="WeatherAgent",
    client=OpenAIChatClient(),
    tools=[get_weather]
)

# Launch DevUI
serve(entities=[agent], auto_open=True)
# Opens browser to http://localhost:8080

Alternativ 2: Katalogidentifiering (CLI)

Om du har agenter och arbetsflöden ordnade i en katalogstruktur startar du DevUI från kommandoraden:

# Launch web UI + API server
devui ./agents --port 8080
# Web UI: http://localhost:8080
# API: http://localhost:8080/v1/*

Mer information om den katalogstruktur som krävs finns i Katalogidentifiering .

Använda OpenAI SDK

DevUI tillhandahåller ett OpenAI-kompatibelt svars-API. Du kan använda OpenAI Python SDK för att interagera med dina agenter:

from openai import OpenAI

client = OpenAI(
    base_url="http://localhost:8080/v1",
    api_key="not-needed"  # API key not required for local DevUI
)

response = client.responses.create(
    metadata={"entity_id": "weather_agent"},  # Your agent/workflow name
    input="What's the weather in Seattle?"
)

# Extract text from response
print(response.output[0].content[0].text)

Mer information om API:et finns i API-referens.

CLI-alternativ

devui [directory] [options]

Options:
  --port, -p      Port (default: 8080)
  --host          Host (default: 127.0.0.1)
  --headless      API only, no UI
  --no-open       Don't automatically open browser
  --tracing       Enable OpenTelemetry tracing
  --reload        Enable auto-reload
  --mode          developer|user (default: developer)
  --auth          Enable Bearer token authentication
  --auth-token    Custom authentication token

Anmärkning

Go-stöd för den här funktionen kommer snart. Se Agent Framework Go-lagringsplatsen för den senaste statusen.

Nästa steg

Gå djupare: