Blazor 中的 JS Interop 支持异步调用和回调，但需注意执行上下文、生命周期和线程模型——JS 函数本身是同步的，但可通过 Promise 包装实现异步语义；.NET 端则用
Task或
ValueTask接收结果，框架自动处理跨线程调度。
异步 JS 函数调用（.NET → JS）
在 JS 端返回
Promise，.NET 端用
InvokeAsync<t></t>调用即可自动等待： JS 文件中导出函数需显式返回
Promise，例如：
window.myApi = {
fetchData: () => fetch('/api/data').then(r => r.json())
};
C# 中调用：var data = await JSRuntime.InvokeAsync<MyData>("myApi.fetchData");
若 JS 函数可能抛错，建议用 try/catch包裹，或在 JS 层统一 reject 错误，Blazor 会转为 .NET 异常
JS 主动回调 .NET 方法（JS → .NET）
通过
DotNetObjectReference将 .NET 实例暴露给 JS，支持异步方法引用： 在组件中创建引用并传入 JS：
private DotNetObjectReference<MyComponent> objRef;<br>protected override void OnInitialized() {<br> objRef = DotNetObjectReference.Create(this);<br> JSRuntime.InvokeVoidAsync("registerCallback", objRef);<br>}
JS 中保存引用，后续调用：window.registerCallback = (dotNetRef) => {<br> window.handleEvent = () => dotNetRef.invokeMethodAsync('OnJsEvent', 'data');<br>};
.NET 方法需标记为 [JSInvokable]，返回
Task即可被 JS 异步调用：
[JSInvokable]<br>public async Task OnJsEvent(string payload)<br>{<br> await DoSomethingAsync(payload);<br> StateHasChanged(); // 如需更新 UI<br>}
清理与生命周期注意事项
未正确释放
DotNetObjectReference会导致内存泄漏，尤其在组件销毁时： 务必在
Dispose或
IAsyncDisposable中调用
objRef?.Dispose()JS 端不应长期持有 .NET 引用；如需解绑，可在 JS 中设为
null，并在 .NET 端检查
this.IsDisposed避免在 JS 回调中重复调用已释放的引用；推荐在 JS 调用前加存在性判断，或使用弱引用模式封装
常见陷阱与建议
实际开发中容易忽略的细节：
UI 更新必须在渲染器线程：JS 回调触发的StateHasChanged()是安全的，但手动启新线程后调用需用
InvokeAsync包裹 序列化限制：JS 传入 .NET 的参数必须可 JSON 序列化；复杂对象建议先 stringify 再解析，或用
IJSInProcessRuntime（仅限 Server-side）绕过序列化 调试技巧：启用浏览器 DevTools 的 “Async stack traces”，并在 JS 中加
console.trace()定位 Promise 链断点
基本上就这些。异步 JS Interop 不复杂但容易忽略上下文切换和资源释放，按规范走，问题很少。
