Aracılığıyla paylaş


Agent Framework ile AG-UI Tümleştirmesi

AG-UI , gerçek zamanlı akış, durum yönetimi ve etkileşimli ui bileşenleri gibi gelişmiş özelliklere sahip web tabanlı yapay zeka aracısı uygulamaları oluşturmanıza olanak tanıyan bir protokoldür. Agent Framework AG-UI tümleştirmesi aracılarınız ve web istemcileriniz arasında sorunsuz bağlantı sağlar.

AG-UI nedir?

AG-UI, aşağıdakiler sağlayan yapay zeka aracısı arabirimleri oluşturmaya yönelik standartlaştırılmış bir protokoldür:

  • Uzak Aracı Barındırma: Yapay zeka aracılarını birden çok istemci tarafından erişilebilen web hizmetleri olarak dağıtma
  • Gerçek Zamanlı Akış: Anında geri bildirim için Sunucu Tarafından Gönderilen Olaylar (SSE) kullanarak aracı yanıtlarını akış halinde iletme
  • Standartlaştırılmış İletişim: Güvenilir aracı etkileşimleri için tutarlı ileti biçimi
  • Oturum Yönetimi: Birden çok istek arasında konuşma bağlamını muhafaza etmek
  • Gelişmiş Özellikler: İnsanlı süreç onayları, durum eşitlemesi ve özel UI oluşturma

AG-UI Ne Zaman Kullanılır?

Aşağıdaki durumlarda AG-UI kullanmayı göz önünde bulundurun:

  • Yapay zeka aracılarıyla etkileşim kuran web veya mobil uygulamalar oluşturma
  • Aracıları birden çok eşzamanlı kullanıcı tarafından erişilebilen hizmetler olarak dağıtma
  • Anında kullanıcı geri bildirimi sağlamak için aracı yanıtlarını gerçek zamanlı olarak akışla aktarın
  • Kullanıcıların yürütmeden önce eylemleri onayladığı onay iş akışlarını uygulama
  • Etkileşimli deneyimler için istemci ile sunucu arasındaki durumu eşitleme
  • Aracı araç çağrılarına göre özel kullanıcı arayüzü bileşenlerini oluşturma

Desteklenen Özellikler

Agent Framework AG-UI tümleştirmesi 7 AG-UI protokol özelliğinin tümünü destekler:

  1. Ajan Temelli Sohbet: Otomatik araç çağırma ile temel akışlı sohbet
  2. Arka Uç Araçlarının İşlenmesi: Araçlar arka uçta çalıştırılır ve sonuçlar istemciye iletilir.
  3. Döngüdeki İnsan: Kullanıcı onayı için işlev onayı istekleri
  4. Aracı Üretici Kullanıcı Arayüzü: İlerleme bilgileriyle uzun süre çalışan işlemler için asenkron araçlar
  5. Araç Tabanlı Oluşturucu Kullanıcı Arabirimi: Araç çağrılarına göre işlenen özel UI bileşenleri
  6. Paylaşılan Durum: İstemci ve sunucu arasında çift yönlü durum eşitlemesi
  7. Tahmine Dayalı Durum Güncelleştirmeleri: İyimser durum güncellemeleri olarak akış aracı değişkenlerini aktarın

CopilotKit ile ajan kullanıcı arayüzleri geliştirme

CopilotKit , standart AG-UI protokolüne göre aracı kullanıcı arabirimleri oluşturmak için zengin ui bileşenleri sağlar. CopilotKit; akış sohbet arabirimlerini, ön uç ve arka uç aracı çağrılarını, döngüdeki insan etkileşimlerini, üretken kullanıcı arabirimini, paylaşılan durumu ve çok daha fazlasını destekler. CopilotKit'in desteklediği çeşitli aracı kullanıcı arabirimi senaryolarının örneklerini AG-UI Dojo örnek uygulamasında görebilirsiniz.

CopilotKit, tekerleği yeniden keşfetmeden şık bir kullanıcı deneyimi sunmanızı sağlarken temsilcinizin yeteneklerine odaklanmanıza yardımcı olur. Microsoft Agent Framework ve CopilotKit'i kullanmaya başlama hakkında daha fazla bilgi edinmek için CopilotKit için Microsoft Agent Framework tümleştirmesi belgelerine bakın.

AG-UI ve Doğrudan Aracı Kullanımı karşılaştırması

Aracı Çerçeve'nin Run ve RunStreamingAsync yöntemlerini kullanarak aracıları doğrudan uygulamanızda çalıştırabilirsiniz ancak AG-UI ek özellikler sağlar:

Özellik Doğrudan Aracı Kullanımı AG-UI Tümleştirmesi
Dağıtım Uygulamaya eklenmiş HTTP üzerinden uzak hizmet
İstemci Erişimi Tek uygulama Birden çok istemci (web, mobil)
Yayın İşlem içi eşzamansız yineleme Server-Sent Olayları (SSE)
Durum Yönetimi Uygulama-yönetimli Protokol düzeyinde durum anlık görüntüleri
Oturum Bağlamı Uygulama-yönetimli Protokol tarafından yönetilen oturum kimlikleri
Onay İş Akışları Özel uygulama Yerleşik ara katman yazılım kalıbı

Mimariye Genel Bakış

AG-UI tümleştirmesi ASP.NET Core kullanır ve temiz bir ara yazılım tabanlı mimariyi izler:

┌─────────────────┐
│  Web Client     │
│  (Browser/App)  │
└────────┬────────┘
         │ HTTP POST + SSE
         ▼
┌─────────────────────────┐
│  ASP.NET Core           │
│  MapAGUI("/", agent)    │
└────────┬────────────────┘
         │
         ▼
┌─────────────────────────┐
│  AIAgent                │
│  (with Middleware)      │
└────────┬────────────────┘
         │
         ▼
┌─────────────────────────┐
│  IChatClient            │
│  (Azure OpenAI, etc.)   │
└─────────────────────────┘

Temel Bileşenler

  • ASP.NET Temel Uç Noktası: MapAGUI uzantı yöntemi HTTP isteklerini ve SSE akışını işler
  • AIAgent: Agent Framework aracısı, IChatClient veya özel bir uygulamadan oluşturulmuştur.
  • Ara Yazılım İşlem Hattı: Onaylar, durum yönetimi ve özel mantık için isteğe bağlı ara yazılım
  • Protokol Bağdaştırıcısı: Aracı Çerçevesi türleri ile AG-UI protokol olayları arasında dönüştürür
  • Sohbet İstemcisi: Microsoft.Extensions.AI sohbet istemcisi (Azure OpenAI, OpenAI, Ollama vb.)

Agent Framework'ın AG-UI'ye Dönüşümü

Agent Framework kavramlarının AG-UI nasıl eşlenir anlamak etkili tümleştirmeler oluşturmanıza yardımcı olur:

Ajan Çerçevesi Kavramı AG-UI Eşdeğeri Description
AIAgent Aracı Uç Noktası Her bir araç bir HTTP uç noktası olur
agent.Run() HTTP POST İsteği İstemci HTTP aracılığıyla ileti gönderir
agent.RunStreamingAsync() Sunucu Tarafından Gönderilen Olaylar Yanıtları SSE aracılığıyla akışla aktarma
AgentResponseUpdate AG-UI Olayları Protokol olaylarına otomatik olarak dönüştürülür
AIFunctionFactory.Create() Arka Uç Araçları Sunucuda yürütüldü, sonuçlar akışla aktarıldı
ApprovalRequiredAIFunction İnsanın Döngü İçine Entegre Edilmesi Ara yazılım onay protokolüne dönüştürülür
AgentSession Oturum Yönetimi ConversationId bağlamı korur
ChatResponseFormat.ForJsonSchema<T>() Durum Kaydı Çekimleri Yapılandırılmış çıkışlar durum olaylarına dönüşür

Kurulum

AG-UI tümleştirmesi ASP.NET Core barındırma paketine dahildir:

dotnet add package Microsoft.Agents.AI.Hosting.AGUI.AspNetCore

Bu paket, dahil olmak üzere Microsoft.Extensions.AIAG-UI tümleştirmesi için gereken tüm bağımlılıkları içerir.

Sonraki Adımlar

AG-UI tümleştirmesini kullanmaya başlamak için:

  1. Başlarken: İlk AG-UI sunucunuzu ve istemcinizi oluşturma
  2. Arka Uç Aracı İşleme: Aracılarınıza işlev araçları ekleme

Ek Kaynaklar

AG-UI ve Doğrudan Aracı Kullanımı karşılaştırması

Aracı Çerçeve'nin run ve run(..., stream=True) yöntemlerini kullanarak aracıları doğrudan uygulamanızda çalıştırabilirsiniz ancak AG-UI ek özellikler sağlar:

Özellik Doğrudan Aracı Kullanımı AG-UI Tümleştirmesi
Dağıtım Uygulamaya eklenmiş HTTP üzerinden uzak hizmet
İstemci Erişimi Tek uygulama Birden çok istemci (web, mobil)
Yayın İşlem içi eşzamansız yineleme Server-Sent Olayları (SSE)
Durum Yönetimi Uygulama-yönetimli Çift yönlü protokol düzeyinde eşitleme
İş Parçacığı Bağlamı Uygulama-yönetimli Protokol tarafından yönetilen iş parçacığı kimlikleri
Onay İş Akışları Özel uygulama Yerleşik protokol desteği

Mimariye Genel Bakış

AG-UI tümleştirmesi temiz, modüler bir mimari kullanır:

┌─────────────────┐
│  Web Client     │
│  (Browser/App)  │
└────────┬────────┘
         │ HTTP POST + SSE
         ▼
┌─────────────────────────┐
│  FastAPI Endpoint       │
│  (add_agent_framework_  │
│   fastapi_endpoint)     │
└────────┬────────────────┘
         │
         ▼
┌─────────────────────────┐
│  AgentFrameworkAgent    │
│  (Protocol Wrapper)     │
└────────┬────────────────┘
         │
         ▼
┌─────────────────────────┐
│  Orchestrators          │
│  (Execution Flow Logic) │
└────────┬────────────────┘
         │
         ▼
┌─────────────────────────┐
│  Agent              │
│  (Agent Framework)      │
└────────┬────────────────┘
         │
         ▼
┌─────────────────────────┐
│  Chat Client            │
│  (Azure OpenAI, etc.)   │
└─────────────────────────┘

Temel Bileşenler

  • FastAPI Uç Noktası: SSE akışını ve istek yönlendirmesini işleyen HTTP uç noktası
  • AgentFrameworkAgent: Agent Framework aracılarını AG-UI protokole uyarlayan basit sarmalayıcı
  • Düzenleyiciler: Farklı yürütme akışlarını işleme (varsayılan, döngüde insan, durum yönetimi)
  • Olay Köprüsü: Agent Framework olaylarını AG-UI protokol olaylarına dönüştürür
  • İleti Bağdaştırıcıları: AG-UI ve Aracı Çerçevesi ileti biçimleri arasında çift yönlü dönüştürme
  • Onay Stratejileri: Etki alanına özgü onay iletileri için genişletilebilir stratejiler

Agent Framework'ın AG-UI'ye Dönüşümü

Agent Framework kavramlarının AG-UI nasıl eşlenir anlamak etkili tümleştirmeler oluşturmanıza yardımcı olur:

Ajan Çerçevesi Kavramı AG-UI Eşdeğeri Description
Agent Aracı Uç Noktası Her bir araç bir HTTP uç noktası olur
agent.run() HTTP POST İsteği İstemci HTTP aracılığıyla ileti gönderir
agent.run(..., stream=True) Sunucu Tarafından Gönderilen Olaylar Yanıtları SSE aracılığıyla akışla aktarma
Aracı yanıt güncelleştirmeleri AG-UI Olayları TEXT_MESSAGE_CONTENT, TOOL_CALL_STARTvb.
İşlev araçları (@tool) Arka Uç Araçları Sunucuda yürütüldü, sonuçlar istemciye akışla aktarıldı
Araç onay modu İnsanın Döngü İçine Entegre Edilmesi Protokol aracılığıyla onay istekleri/yanıtları
Konuşma geçmişi İş Parçacığı Yönetimi threadId istekler arasında bağlamı korur

Kurulum

AG-UI tümleştirme paketini yükleyin:

pip install agent-framework-ag-ui --pre

Bu, hem temel aracı çerçevesini hem de AG-UI tümleştirme bileşenlerini yükler.

Sonraki Adımlar

AG-UI tümleştirmesini kullanmaya başlamak için:

  1. Başlarken: İlk AG-UI sunucunuzu ve istemcinizi oluşturma
  2. Arka Uç Aracı İşleme: Aracılarınıza işlev araçları ekleme

Ek Kaynaklar