Flutter中promiseToFuture调用后始终不返回的问题排查

安全阿岳

2026-6-23

问题分析与解决方案

你的问题出在Dart对JS Promise的包装识别问题：使用dart:js库的context.callMethod调用JS async函数时，返回的是JsObject类型的包装对象，而dart:js_util的promiseToFuture无法正确识别这个包装后的Promise，导致即使JS端的Promise已经resolve，Dart的await仍会无限阻塞。

解决方法

改用dart:js_util库的callMethod来调用全局JS函数，它会直接返回原生JS Promise对象，promiseToFuture可以正确处理。

修改后的Dart代码示例

import 'dart:html';
import 'dart:js_util' as js_util;

// ... 其他代码

final ScriptElement script = ScriptElement()
  ..async = true
  ..src = "assets/lib/myjscode.js";
querySelector('head')!.children.add(script);

await script.onLoad.first;

// 使用js_util的callMethod调用全局函数
var jsRes = js_util.callMethod(window, 'initJS', []);
// 此时promiseToFuture可以正确识别Promise并等待resolve
var pr = await js_util.promiseToFuture(jsRes); 

// 现在可以执行到这行
print("Complete: $pr"); // 输出 "Complete: test"

另一种兼容方案（保留dart:js调用）

如果一定要用dart:js的context，可以通过JsObject的raw属性获取原生JS对象，再传给promiseToFuture：

import 'dart:js' as js;
import 'dart:js_util' as js_util;

// ... 其他代码

var jsRes = js.context.callMethod('initJS');
// 提取原生JS Promise对象
var pr = await js_util.promiseToFuture(jsRes.raw); 

print("Complete: $pr");