2025活动

DevExpress控件使用交流,DevExpress中国社区Dev联系电话 联系电话:023-68661681

DevExpress Blazor中文教程:AI聊天 - 如何完成工具呼叫确认?(三)

来源:   发布时间:2025-09-09   浏览:23次

DevExpress Blazor UI组件使用了C#为Blazor Server和Blazor WebAssembly创建高影响力的用户体验,这个UI自建库提供了一套全面的原生Blazor UI组件(包括Pivot Grid、调度程序、图表、数据编辑器和报表等)。

现代AI驱动的应用程序通常会自动执行工具来响应用户查询,虽然这种自动化包含了llm的潜力并改善了用户体验,但在未经用户明确同意的情况下调用敏感操作(例如,修改数据库、发送电子邮件或对外部服务进行API调用)时,它可能会引入安全风险。

本文主要介绍了Tool Call Confirmation API(工具调用)层和DevExpress Blazor AI Chat组件的相关可自定义接口的目的,DevExpress的解决方案拦截AI发起的函数调用,生成详细的确认对话框,并在执行前需要用户批准,这种UI模式在GitHub Copilot Chat、Cursor、Claude和其他具有MCP支持的AI驱动应用程序中很常见。

界面控件DevExpress Blazor中文教程图集

在上文中(点击这里回顾>>),我们为大家介绍了如何创建确认UI、将确认UI集成到Blazor AI Chat系统等,本文将继续介绍用户体验的实践、高级自定义选项等,欢迎下载最新版体验!

获取DevExpress v25.1正式版下载

DevExpress技术交流群11:749942875      欢迎一起进群讨论

用户体验的实践

当用户请求天气信息时,会出现以下顺序:

  1. LLM确定需要进行函数调用。
  2. 将显示一个确认对话框(替代立即执行)。
  3. 确认对话框显示工具名称、描述和检索的参数。
  4. 用户可以批准或取消该操作。
  5. 只有经过批准的工具才会被执行(它们的结果返回给LLM)。
界面控件DevExpress Blazor中文教程图集
高级自定义选项
选择性工具调用确认

SelectiveToolCallFilter扩展IToolCallFilter,在调用用于执行敏感操作(如删除数据,发送电子邮件或处理付款)的工具之前要求用户确认:

public class SelectiveToolCallFilter : IToolCallFilter {
private readonly string[] _sensitiveOperations = { "DeleteData", "SendEmail", "ChargePayment" };

public Task<bool> InvokeFunctionFilter(FunctionInvocationContext context) {
// Only require confirmation for sensitive operations
if (!_sensitiveOperations.Contains(context.Function.Name)) {
return Task.FromResult(true);
}

// Show confirmation for sensitive operations
if (ToolCalled is null)
return Task.FromResult(true);

var tcs = new TaskCompletionSource<bool>();
ToolCalled.Invoke(context, tcs);
return tcs.Task;
}
}
增强的确认界面

修改 ConfirmationButtons.razor组件,来根据UI需求创建确认对话框。您可以修改布局,应用自定义样式,并通知用户他们将要执行的工具。

<div class="tool-confirmation-container">
<div class="confirmation-header">
<h5>⚠️ Function Execution Request</h5>
</div>

<div class="function-details">
<div class="detail-row">
<span class="label">Function:</span>
<span class="value">@_pendingContext.Function.Name</span>
</div>
<div class="detail-row">
<span class="label">Description:</span>
<span class="value">@_pendingContext.Function.Description</span>
</div>
</div>

<div class="arguments-section">
<h6>Arguments:</h6>
@foreach(var arg in _pendingContext.Arguments) {
<div class="argument-item">
<strong>@arg.Key:</strong> @arg.Value
</div>
}
</div>

<div class="action-buttons">
<DxButton Text="Approve"
RenderStyle="ButtonRenderStyle.Success"
Click="() => OnDecisionMade(true)" />
<DxButton Text="Deny"
RenderStyle="ButtonRenderStyle.Danger"
Click="() => OnDecisionMade(false)" />
</div>
</div>
审计跟踪

记录用户决策的相关细节(如工具名称、函数参数、时间戳和用户角色):

public class AuditingToolCallFilter : IToolCallFilter {
private readonly ILogger<AuditingToolCallFilter> _logger;

public AuditingToolCallFilter(ILogger<AuditingToolCallFilter> logger) {
_logger = logger;
}

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

// Subscribe to the task completion to log the decision
tcs.Task.ContinueWith(task => {
if (task.IsCompletedSuccessfully)
{
OnDecisionMade(task.Result, context);
}
}, TaskContinuationOptions.ExecuteSynchronously);

ToolCalled.Invoke(context, tcs);
return tcs.Task;
}

private void OnDecisionMade(bool decision, FunctionInvocationContext context) {
_logger.LogInformation("User {Decision} function call: {FunctionName} with args: {Arguments}",
decision ? "approved" : "denied",
context.Function.Name,
string.Join(", ", context.Arguments.Select(a => $"{a.Key}={a.Value}")));

// Send decision data to the analytics service
// TrackUserDecision(decision, context);
}
}
安全注意事项

确认UI增强了函数调用的透明性和用户控制,为加强确认用户界面的安全性,可采取以下措施:

  • 速率限制:限制每个用户或会话的工具调用次数。
  • 权限检查:在显示确认对话框之前验证用户权限。
  • 函数验证:在执行函数之前验证函数参数。
  • 审计跟踪:记录所有工具调用和用户决策,以便进行监视和遵从。
  • 超时处理:如果用户在预定义的时间内没有响应,则自动拒绝工具执行。

更多产品资讯及授权,欢迎来电咨询:023-68661681


更多DevExpress线上公开课、中文教程资讯请上中文网获取

关于慧都科技

慧都是⼀家⾏业数字化解决⽅案公司,专注于软件、⽯油与⼯业领域,以深⼊的业务理解和⾏业经验,帮助企业实现智能化转型与持续竞争优势。

慧都是DevExpress的中国区的合作伙伴,DevExpress作为用户界面领域的优秀产品,帮助企业高效构建权限管理、数据可视化(如网格/图表/仪表盘)、跨平台系统(WinForms/ASP.NET/.NET MAUI)及行业定制解决方案,加速开发并强化交互体验。

本站文章除注明转载外,均为本站原创或翻译
欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果
转载请注明:文章转载自:DevExpress控件中文网 [https://www.devexpresscn.com/]
本文地址:https://www.devexpresscn.com/post/5445.html

相关产品: DevExpress WPF Subscription, DevExpress WinForms Subscription, DevExpress Universal Subscription,

扫码咨询
电话咨询
023-68661681
返回
顶部