将Dart函数暴露给JavaScript

Question

我对Dart还不是很熟悉，正在尝试用它编写一些库函数来入门。

虽然我已经可以从Dart调用JavaScript函数，但我很想能够从JavaScript调用Dart函数，但到目前为止，我没有太多进展。

例如，我希望能够暴露一些基本的Dart函数，就像这样:

main() {
  String foo() {
    return "bar!";
  }

  js.scoped(() {
    js.context.foo = foo;
  });
}

然后能够从 JavaScript 中调用它们，像这样：

<script>
  window.onload = function() {
    alert("foo() = " + foo());
  }
</script>

这样的事情真的可能吗？

- Mason Bryant

---

请参见https://dev59.com/WZDea4cB1Zd3GeqPXyvQ。 - Günter Zöchbauer

Answer 1

没问题！查看从JavaScript调用Dart。

针对您的情况：

import 'dart:js' as js;
main() {
  String foo() {
    return "bar!";
  }

  js.context['foo'] = foo;
}

- Alexandre Ardhuin

---

“回调函数”在链接的文档“从JavaScript调用Dart”中没有提到。它被删除了吗？ - Günter Zöchbauer

是的，答案已经过时了。 - Alexandre Ardhuin

答案已更新。您所看到的是当前的操作方式。 - Alexandre Ardhuin

你可以直接赋值 "js.context.foo=foo"，除非你从代理获取并想要一个 null 而不是错误，否则不需要使用 [] 索引语法。 - Pat Niemeyer

不应使用 package:js（请参见 https://code.google.com/p/dart/issues/detail?id=15795#c15 了解更多详细信息）。示例代码适用于 dart:js。 - Alexandre Ardhuin

Answer 2

在Dart 1.20中，我需要添加allowInterop()。

import 'dart:js' as js;
main() {
  String foo() {
    return "bar!";
  }

  js.context['foo'] = allowInterop(foo);
}

- Günter Zöchbauer

---

这在原生Dart（dartium）中运行良好，但在JS编译版本（Chrome、FF、IE等）中不起作用。请查看此截图。当我删除allowInterop时，它甚至可以在JS编译版本中工作。我正在使用Dart 1.19.1。这是在1.20中修复的问题吗？ - Ivo Skalický

在 Chrome 和 Dartium 中似乎对我起作用。我会再次检查并汇报。 - Günter Zöchbauer

再次检查后，我可以确认它在Dartium和Chrome中都能正常工作。 - Günter Zöchbauer

感谢您的验证。我尝试创建一个空的Polymer示例项目，只包含上面截图中的代码，但是在使用allowInterop时无法在IE、FF、Chrome中正常工作（在Dartium中可以）。我已经在多个浏览器和多台计算机上进行了测试。如果您想要测试它，可以访问以下链接：http://data.itpro.cz/dart_allowinterop。当您在Chrome中按下F12并键入：foo()时，会出现错误，如果键入foo2()，则会写入“bar2！” - Ivo Skalický

Answer 3

在Dart 2.3.0中，我需要稍微调整一下解决方案，让allowInterop更好地运行。"最初的回答"

    import 'dart:js' as js;
    main() {
      String foo() {
        return "bar!";
      }

      js.context['foo'] = js.allowInterop(foo);
    }

- rkunboxed