DevUI

DevUI, Microsoft Agent Framework'te aracıları ve iş akışlarını çalıştırmaya yönelik basit, tek başına bir örnek uygulamadır. OpenAI uyumlu API arka ucuyla birlikte etkileşimli test için bir web arabirimi sağlar ve bunları uygulamalarınızla tümleştirmeden önce oluşturduğunuz aracılarda ve iş akışlarında görsel olarak hata ayıklamanıza, test edip yinelemenize olanak tanır.

Önemli

DevUI, geliştirme sırasında aracılarınızı ve iş akışlarınızı görselleştirmenize ve hatalarını ayıklamanıza yardımcı olan örnek bir uygulamadır . Üretim kullanımına yönelik değildir .

Paketleri yükleme

Tek bir .NET hizmeti için DevUI paketini yükleyin. Birden çok aracı servisi bir araya getiren bir Aspire AppHost için Aspire barındırma entegrasyonunu da yükleyin.

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

Aspire ile DevUI kullanma

Her aracı hizmeti OpenAI Yanıtları ve Konuşmalar uç noktalarını kullanıma sunar. Aspire AppHost bir DevUI kaynağı ekler ve aracı hizmetlerini bağlar.

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);

WithAgentService öğesine geçirilen agents: adları, her hizmette AddAIAgent(...) tarafından kaydedilen adlarla eşleşmelidir.

Aracı hizmetinin uç noktalarını erişime açma


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 birleştiricisi, yapılandırılan tüm hizmetlerdeki varlıkları birleştirir ve Responses ile Conversations isteklerini doğru arka uca yönlendirir.

Aracı dizini ve izlemeyi gösteren Agent Framework DevUI panosu

Özellikler

  • Web Arabirimi: Aracıları ve iş akışlarını test etme için etkileşimli kullanıcı arabirimi
  • Esnek Giriş Türleri: İş akışınızın ilk yürütücüsü temelinde metin, dosya yüklemeleri ve özel giriş türleri desteği
  • Directory-Based Keşif: Dizin yapısından aracıları ve iş akışlarını otomatik olarak keşfetme
  • In-Memory Kaydı: Varlıkları dosya sistemi kurulumu yapmadan programatik olarak kaydetme
  • OpenAI-Compatible API: Aracılarınızla etkileşime geçmek için OpenAI Python SDK'sını kullanma
  • Örnek Galeri: Hiçbir varlık keşfedilmediğinde seçilmiş örneklere göz atın ve indirin
  • İzleme: Hata ayıklama ve gözlemlenebilirlik için OpenTelemetry izlemelerini görüntüleme

Giriş Türleri

DevUI, giriş arabirimini varlık türüne göre uyarlar:

  • Aracılar: Çok modüllü etkileşimler için metin girişini ve dosya eklerini (görüntüler, belgeler vb.) destekleme
  • İş akışları: Giriş arabirimi, ilk yürütücünün giriş türüne göre otomatik olarak oluşturulur. DevUI iş akışını gözden geçirerek beklenen giriş şemasını yansıtır, böylece yapılandırılmış veya özel giriş türleriyle iş akışlarını test etmek kolaylaşır.

Bu dinamik giriş işleme aracılarınızı ve iş akışlarınızı uygulamanızda giriş alacakları şekilde test etmenizi sağlar.

Installation

PyPI'dan DevUI yükleyin:

pip install agent-framework-devui --pre

Hızlı Başlangıç

Seçenek 1: Programlı Kayıt

Bellekte kayıtlı aracılarla DevUI'i başlatın:

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

Seçenek 2: Dizin Bulma (CLI)

Dizin yapısında düzenlenmiş aracılarınız ve iş akışlarınız varsa, komut satırından DevUI'yi başlatın:

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

Gerekli dizin yapısıyla ilgili ayrıntılar için bkz. Dizin Bulma .

OpenAI SDK'sını kullanma

DevUI, OpenAI uyumlu bir Yanıtlar API'si sağlar. Aracılarınızla etkileşime geçmek için OpenAI Python SDK'sını kullanabilirsiniz:

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)

API hakkında daha fazla bilgi için bkz. API Başvurusu.

CLI Seçenekleri

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

Uyarı

Bu özellik için Go desteği yakında sunulacaktır. En son durum için bkz. Agent Framework Go deposu .

Sonraki Adımlar

Dizin Keşfi

Daha derine gidin:

  • Last updated on