DevExpress Blazor UI組件使用了C#為Blazor Server和Blazor WebAssembly創(chuàng)建高影響力的用戶體驗(yàn)，這個(gè)UI自建庫(kù)提供了一套全面的原生Blazor UI組件（包括Pivot Grid、調(diào)度程序、圖表、數(shù)據(jù)編輯器和報(bào)表等）。

現(xiàn)代AI驅(qū)動(dòng)的應(yīng)用程序通常會(huì)自動(dòng)執(zhí)行工具來(lái)響應(yīng)用戶查詢，雖然這種自動(dòng)化包含了llm的潛力并改善了用戶體驗(yàn)，但在未經(jīng)用戶明確同意的情況下調(diào)用敏感操作（例如，修改數(shù)據(jù)庫(kù)、發(fā)送電子郵件或?qū)ν獠糠?wù)進(jìn)行API調(diào)用）時(shí)，它可能會(huì)引入安全風(fēng)險(xiǎn)。

本文主要介紹了Tool Call Confirmation API（工具調(diào)用）層和DevExpress Blazor AI Chat組件的相關(guān)可自定義接口的目的，DevExpress的解決方案攔截AI發(fā)起的函數(shù)調(diào)用，生成詳細(xì)的確認(rèn)對(duì)話框，并在執(zhí)行前需要用戶批準(zhǔn)，這種UI模式在GitHub Copilot Chat、Cursor、Claude和其他具有MCP支持的AI驅(qū)動(dòng)應(yīng)用程序中很常見。

在本文中，我們將帶大家了解DevExpress的AI聊天確認(rèn)系統(tǒng)、它的關(guān)鍵組件和自定義選項(xiàng)（當(dāng)然還會(huì)向您展示如何使用DevExpress Blazor AI Chat控件將這個(gè)安全層添加到AI驅(qū)動(dòng)的Blazor應(yīng)用程序中）。

獲取DevExpress v25.1正式版下載

DevExpress技術(shù)交流群11：749942875      歡迎一起進(jìn)群討論

挑戰(zhàn)：平衡自動(dòng)化和安全性

AI函數(shù)調(diào)用是一種強(qiáng)大的資源，它允許模型與應(yīng)用程序功能無(wú)縫交互。然而必須負(fù)責(zé)任地使用這種能力，考慮以下使用場(chǎng)景：

• AI模型刪除用戶數(shù)據(jù)來(lái)響應(yīng)不明確的請(qǐng)求。
• 非托管API調(diào)用會(huì)產(chǎn)生意想不到的成本或觸發(fā)外部流程。
• 函數(shù)在用戶不知情的情況下修改應(yīng)用程序狀態(tài)或UI。

本文中描述的技術(shù)在便利性和控制性之間取得了平衡：它保留了自動(dòng)工具調(diào)用的好處，并為用戶提供了對(duì)敏感或不可逆操作的明確權(quán)限。

開始前

在您的Blazor應(yīng)用程序中創(chuàng)建和配置DevExpress Blazor Chat （DxAIChat）組件。

這個(gè)例子的目標(biāo)是Azure OpenAI，但是這個(gè)解決方案與任何實(shí)現(xiàn)了來(lái)自 "Microsoft.Extensions.AI"庫(kù)的IChatClient接口的AI服務(wù)兼容。

Program.cs中的以下代碼定義了基本配置：

using Azure;
using Azure.AI.OpenAI;
using Microsoft.Extensions.AI;

var builder = WebApplication.CreateBuilder(args);

// Replace with your endpoint, API key, and model's deployment name
string azureOpenAIEndpoint = Environment.GetEnvironmentVariable("AZURE_OPENAI_ENDPOINT");
string azureOpenAIKey = Environment.GetEnvironmentVariable("AZURE_OPENAI_API_KEY");
string deploymentName = "your-model-deployment-name";

var azureChatClient = new AzureOpenAIClient(
new Uri(azureOpenAIEndpoint),
new AzureKeyCredential(azureOpenAIKey))
.GetChatClient(deploymentName)
.AsIChatClient();

builder.Services.AddDevExpressBlazor();
builder.Services.AddDevExpressAI();

架構(gòu)概述

• IToolCallFilter
  在AI工具調(diào)用執(zhí)行之前管理它們。
• CustomFunctionInvokingChatClient
  擴(kuò)展用于調(diào)用工具的默認(rèn)操作。
• CustomFunctionInvokingChatClientExtensions
  在構(gòu)建聊天客戶端時(shí)，F(xiàn)luent API允許您通過(guò)一行配置來(lái)利用工具調(diào)用確認(rèn)。
• 確認(rèn)界面
  顯示用于確認(rèn)工具調(diào)用的對(duì)話框。

管理工具調(diào)用

DevExpress確認(rèn)系統(tǒng)的核心是IToolCallFilter接口——這個(gè)接口定義了聊天器攔截和管理函數(shù)調(diào)用的方式。

public interface IToolCallFilter {
public event Action<FunctionInvocationContext, TaskCompletionSource<bool>> ToolCalled;

Task<bool> InvokeFunctionFilter(FunctionInvocationContext context);
}

MyToolCallFilter管理AI觸發(fā)的操作，并僅在獲得批準(zhǔn)時(shí)執(zhí)行敏感操作。API設(shè)計(jì)允許過(guò)濾器暫停函數(shù)執(zhí)行，等待用戶輸入，并根據(jù)用戶的決定繼續(xù)或取消，TaskCompletionSource實(shí)例支持UI和過(guò)濾器邏輯之間的異步通信。

public class MyToolCallFilter : IToolCallFilter {
public event Action<FunctionInvocationContext, TaskCompletionSource<bool>> ToolCalled;

public Task<bool> InvokeFunctionFilter(FunctionInvocationContext context) {
if (ToolCalled is null)
return Task.FromResult(true);

var tcs = new TaskCompletionSource<bool>();
ToolCalled.Invoke(context, tcs);
return tcs.Task;
}
}

確認(rèn)工具調(diào)用（CustomFunctionInvokingChatClient）

CustomFunctionInvokingChatClient類擴(kuò)展了DevExpress Blazor AI Chat控件的默認(rèn)操作：

• 攔截AI工具調(diào)用（定義一個(gè)自定義的FunctionInvoker委托）。
• 檢查確認(rèn)邏輯（過(guò)濾器是否已在服務(wù)集合中注冊(cè)）。
• 在用戶批準(zhǔn)后進(jìn)行。如果用戶取消請(qǐng)求，CustomFunctionInvoker方法調(diào)用將返回取消消息，取代執(zhí)行工具。該消息告訴LLM操作被中止，請(qǐng)求的信息不可用。

public class CustomFunctionInvokingChatClient : FunctionInvokingChatClient {
public CustomFunctionInvokingChatClient(IChatClient innerClient, ILoggerFactory? factory = null,
IServiceProvider? services = null)
: base(innerClient, factory, services) {
if(services == null) {
throw new ArgumentNullException(nameof(services), "Service provider cannot be null.");
}
FunctionInvoker = CustomFunctionInvoker;
}

private async ValueTask<object?> CustomFunctionInvoker(FunctionInvocationContext context,
CancellationToken cancellationToken) {
IToolCallFilter? filter = FunctionInvocationServices!.GetService<IToolCallFilter>();

if(await (filter?.InvokeFunctionFilter(context) ?? Task.FromResult(true))) {
return await context.Function.InvokeAsync(context.Arguments, cancellationToken);
}

return "The tool call was cancelled by the user. Do not attempt to invoke this tool again. Return a message indicating that the call was cancelled and that the weather information is unavailable at this time.";
}
}

未完待續(xù)，下期繼續(xù)......

更多產(chǎn)品資訊及授權(quán)，歡迎來(lái)電咨詢：023-68661681

關(guān)于慧都科技

慧都是?家?業(yè)數(shù)字化解決?案公司，專注于軟件、?油與?業(yè)領(lǐng)域，以深?的業(yè)務(wù)理解和?業(yè)經(jīng)驗(yàn)，幫助企業(yè)實(shí)現(xiàn)智能化轉(zhuǎn)型與持續(xù)競(jìng)爭(zhēng)優(yōu)勢(shì)。

慧都是DevExpress的中國(guó)區(qū)的合作伙伴，DevExpress作為用戶界面領(lǐng)域的優(yōu)秀產(chǎn)品，幫助企業(yè)高效構(gòu)建權(quán)限管理、數(shù)據(jù)可視化（如網(wǎng)格/圖表/儀表盤）、跨平臺(tái)系統(tǒng)（WinForms/ASP.NET/.NET MAUI）及行業(yè)定制解決方案，加速開發(fā)并強(qiáng)化交互體驗(yàn)。