跟我一起从零开始学习WebAssembly(四)、将C/C++函数封装为接口,供js调用


如果你想在C/C++代码中定义一个你需要从JavaScript调用的函数,你可以使用Emscripten 的ccall()函数并使用EMSCRIPTEN_KEEPALIVE声明(它将添加你的函数到导出函数列表)来完成

1、创建一个hello.c文件

新建一个目录hello3,并在hello3中新建文件hello3.c,且加入如下代码:

#include <stdio.h>
#include <emscripten/emscripten.h>

int main(int argc, char ** argv)
{
    printf("Hello World\n");
}

#ifdef __cplusplus
extern "C"
{
#endif

void EMSCRIPTEN_KEEPALIVE myFunction(int argc, char ** argv)
{
    printf("MyFunction Called\n");
}

#ifdef __cplusplus
}
#endif

默认情况下,Emscripten生成的代码总是只调用该main()函数,其他函数作为死代码被删除。将EMSCRIPTEN_KEEPALIVE放在函数名称之前可以阻止这种情况发生。您还需要导入emscripten.h库来使用EMSCRIPTEN_KEEPALIVE。

注意:我们包含#ifdef块,因此如果您尝试将其包含在C ++代码中,该示例仍然有效。由于C与C ++名称修改规则,为防止被终止,但在这里我们设置它,以便在使用C ++时将其视为外部C函数。

2、添加模板文件HTML

在上一级新建html_template目录,并将shell_minimal.html复制到目录中。

3、编译

现在让我们再次运行编译步骤。 从最新目录内部(以及在Emscripten编译器环境终端窗口内),使用以下命令编译C代码。 (注意我们需要使用NO_EXIT_RUNTIME进行编译,这是必要的,否则当main()退出运行时将被关闭 - 正确的C仿真所必需的,例如,调用atexits - 并且调用编译的代码是无效的。)

emcc -o hello3.html hello3.c -O3 -s WASM=1 --shell-file ../html_template/shell_minimal.html -s NO_EXIT_RUNTIME=1  -s "EXTRA_EXPORTED_RUNTIME_METHODS=['ccall']"

4、运行

如果你再次在浏览器中加载示例,你将看到与以前相同的内容!
运行结果

5、调用接口

  • 1、现在我们需要myFunction()从JavaScript 运行我们的新函数。首先,在文本编辑器中打开hello3.html文件。

  • 2、添加<button>如下所示的元素,就在第一个开始<script type='text/javascript'>处的上方。

<button class="mybutton">Run myFunction</button>
  • 3、现在在第一个 <script>元素的末尾添加以下代码:如图
    添加代码
  • 4、再次运行,并点击mybutton按钮,结果如图:
    运行效果
    这样,我们就完成了对接口的调用。
发布了135 篇原创文章 · 获赞 67 · 访问量 23万+

猜你喜欢

转载自blog.csdn.net/y601500359/article/details/95059737