Flutter runJavascriptReturningResult 返回“{}”

Question

我有一个返回一些数据的 JavaScript 函数。当我直接从浏览器运行此函数时，我得到了预期的结果。但是，当我使用 runJavascriptReturningResult() 从 Flutter WebView 运行它时，我总是得到一个类似 '{}' 的字符串。

JavaScript 函数进行 axios 调用，但我不确定这是否相关。

我已经按照建议仅在触发 onPageFinished 事件时运行 runJavascriptReturningResult() 。

      var controller = await _controllerCompleter.future;
      var result = await controller.runJavascriptReturningResult('getSomeData()');

此外，我在 WebView 中使用 React/Next 应用程序。我认为这不应该是一个问题，因为从 Flutter 调用该函数时我已经可以访问 DOM。如果我调用一个不存在的函数，我会收到“null”作为响应，而不是“{}”。但是，我不确定此信息是否相关。作为参考，下面是我公开要从 WebView 调用的 JavaScript 函数的代码部分：

  const getSomeData = useCallback( async() => {
    try {
      const response = await axios.get('/api/getData', {
      })
      return JSON.stringify(response)
    } catch (e) {
      return JSON.stringify(e)
    }
  }, [])

  useEffect(() => {
    (window as any).getSomeData = getSomeData
  }, [])

我也已经尝试在 flutter 调用时在 js 函数之前放置一个“await”，因为该函数是异步的，但这样做时结果变成“null”：

var result = await controller.runJavascriptReturningResult('await getSomeData()');

我尝试的另一件事是返回完整的响应而不是 JSON.stringfy(response)。得到了相同的结果。

顺便说一下，我在 JS 返回之前添加了一个 console.log(response)，它返回了正确的数据。问题只是当flutter应用程序读取数据时它变成了“{}”

Answer 1

我相信这种情况正在发生，因为

getSomeData()

是异步的。 据我所知，

runJavaScriptReturningResult

不支持异步JavaScript，因为我得到了与它返回“{}”相同的结果。 这很令人困惑，因为您正在等待

var result = await controller.runJavascriptReturningResult('getSomeData()');

但不是实际的

解决方案是在

runJavaScript

上使用

WebViewController

来代替，并在控制器上设置一个通道来捕获结果。