C/C++转WebAssembly及微信小程序调用

上一篇文章讲了C/C++如何转WebAssembly,并测试了在Web端调用。本篇内容和上篇一样,介绍C/C++包转的.wasm包如何在小程序中调用。

说明

本篇是在上一篇步骤1-4的基础上,再做修改,供微信小程序端调用的方法和步骤。

本篇操作手册可以参考如下文档:

  • https://www.cijiyun.com/newsview?id=64139
  • https://developer.mozilla.org/en-US/docs/WebAssembly/C_to_wasm

前情提要

通过上篇文章我们知道,将编写好的C/C++代码打包成.wasm,会同时生成.html、.js文件(具体方法参考 C/C++转WebAssembly流程及Web端调用测试 这一篇中的步骤 1-4)。文件如下:

在这里插入图片描述

对于微信小程序,直接编译打包后的包无法直接调用,所以还需要进行一些代码修改。

注意:此处修改web_assembly_test.js文件,是在上一篇修改之后的基础上再做修改,所以,需要先对上一篇文章有所了解。

具体步骤如下:

第一步:新建文件及目录

在小程序文件夹中新建文件目录,包括:

  • pages/worker目录:用于进行打包文件的调用
  • workers目录:与pages平齐,创建workers目录,用于存放.wasm文件

目录结构如下:

在这里插入图片描述

说明:

  • workers目录中,只需要存放web_assembly_test.wasm即可,其它文件可以不需要。这样做的目的是:为了把.wasm打包进去,并且还可以分包打包
  • 在调用.wasm包的page中(pages/worker目录),只需要.js即可,这个文件包含了一些调用.wasm文件的方法。参考文档:https://www.cijiyun.com/newsview?id=64139

第二步:修改web_assembly_test.js文件

  1. web_assembly_test.js文件的最底部添加
module.exports = {Module: Module
}

如下:

在这里插入图片描述

  1. 注释scriptDirectory = self.location.href代码
// scriptDirectory = self.location.href
  1. 修改instantiateArrayBuffer函数

将该方法修改为如下:

function instantiateArrayBuffer(binaryFile, imports, receiver) {return WXWebAssembly.instantiate('/workers/web_assembly_test.wasm', imports).then(function(instance) {return instance;}).then(receiver, function(reason) {err('failed to asynchronously prepare wasm: ' + reason);// Warn on some common problems.if (isFileURI(wasmBinaryFile)) {err('warning: Loading from a file URI (' + wasmBinaryFile + ') is not supported in most browsers. See https://emscripten.org/docs/getting_started/FAQ.html#how-do-i-run-a-local-webserver-for-testing-why-does-my-program-stall-in-downloading-or-preparing');}abort(reason);})
}

说明:

  • 上面方法中的'/workers/web_assembly_test.wasm',是指.wasm文件的存放路径。最好不要存放在同一个目录,新建一个和pages平级的目录进行存放

修改如下:

  1. 将所有.js文件中的WebAssembly修改为WXWebAssembly

至此,.js文件的修改全部完成了,下面进行方法调用。

第三步:调用方法

参考前一篇文章中的定义,我们定义了两个方法:myFunctionmyMaxFunc。方法的调用位置在pages/worker/index.ts中。

  • 首先,引入文件
const web_assembly_test = require('./web_assembly_test')
  • 其次,使用方法
/*** 生命周期函数--监听页面初次渲染完成*/onReady() {const moudule = web_assembly_test.Modulemoudule.ccall('myMaxFunc', null, null, null)moudule.ccall('myFunction', null, null, null)},

说明:具体调用原理,参考上一篇。

  • 最后,进行结果验证

结合上文中的说明:这两个方法里并没有具体的方法执行,只写了输出。在控制台中查看:

在这里插入图片描述

可以看到,每个方法都在控制台中打印了该方法指定的输出结果。

在小程序中调用方法的功能全部实现。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/308235.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

maven命令行安装依赖测试

mvn dependency:get -DgroupIdorg.springframework -DartifactIdspring-core -Dversion5.3.9作用:可用于测试配置环境变量后,能否下载依赖到本地仓库

微软的 Copilot 已经如同 ChatGPT 一样,成为了安卓平台上的一款应用程序

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗?订阅我们的简报,深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同,从行业内部的深度分析和实用指南中受益。不要错过这个机会,成为AI领…

MR实战:实现数据去重

文章目录 一、实战概述二、提出任务三、完成任务(一)准备数据文件1、在虚拟机上创建文本文件2、上传文件到HDFS指定目录 (二)实现步骤1、Map阶段实现(1)创建Maven项目(2)添加相关依赖…

java使用JSON工具解析字符串、数组详解

一:问题 1.最近自己在前后端数据交互时需要进行JSON格式字符串、数组数据进行转换,进行问题整理 2.遇到需要JSON字符串转换的朋友可以阅读 二:解析步骤 1.第一点首先确定需求,明确需要转的字符串是一个对象还是一个数组&#…

边缘计算网关:重新定义物联网数据处理

随着物联网(IoT)设备的爆炸式增长,数据处理和分析的需求也在迅速增加。传统的数据处理方式,将所有数据传输到中心服务器进行处理,不仅增加了网络负担,还可能导致数据延迟和安全问题。因此,边缘计…

电气产品外壳常用材质PA、PC、PBT、ABS究竟是什么?

在如今工业制造领域,各种改性塑料、复合材料以及轻质合金材料的运用日趋成熟。在电气领域,不同电气产品的外壳、组件材质采用不同材料,以同为科技(TOWE)电气产品为例,工业连接器系列产品采用PA6外壳材质、机…

小米电脑管家 - 手机平板电脑家居互联

系列文章目录 前言 联想电脑安装小米电脑管家实现设备互联 如图,将 小米平板 5 Pro 作为联想笔记本 GeekPro 5000 (这垃圾电脑)的副屏。 可以在小米平板控制笔记本,如图所示 一、官方使用手册 参考:小米电脑管家帮助 …

浅谈高并发以及三大利器:缓存、限流和降级

引言 高并发背景 互联网行业迅速发展,用户量剧增,系统面临巨大的并发请求压力。 软件系统有三个追求:高性能、高并发、高可用,俗称三高。三者既有区别也有联系,门门道道很多,全面讨论需要三天三夜&#…

交叉编译aarch64架构支持openssl的curl、libcurl

本文档旨在指导读者在x86_64平台上交叉编译curl和openssl库以支持aarch64架构。在开始之前,请确保您的系统环境已正确配置。 1. 系统环境准备 系统是基于Ubuntu 20.04 LTS,高版本可能会有问题。首页,安装必要的开发工具和库文件。打开终端并…

楼宇对讲门铃选型分析

目前很多的高层住宅都使用了对讲门铃了,在频繁使用中,门铃会出现的越来越多种类,下面我就简单的介绍会有用到的几款芯片. 语音通话芯片:D34018,D34118,D5020,D31101; D34018 单片电话机通话电路,合并了必 需的放大器…

【CSS3】第5章 盒子模型

学习目标 熟悉盒子模型的概念&#xff0c;能够说出盒子模型的基本结构。 掌握<div>标签的用法&#xff0c;能够使用<div>标签制作页面模块。 掌握边框属性的用法&#xff0c;能够为盒子设置不同的边框效果。 掌握边距属性的用法&#xff0c;能够使用内边距和外边…

thingsboard前端缓存--nginx

thingsboardnginx thingsboard部署到阿里云服务器之后&#xff0c;由于登录界面要发送的文件很大&#xff0c;并且服务器的带宽目前有限&#xff0c;因此配置一个nginx&#xff0c;进行前端页面的一些缓存&#xff0c;参考了https://qianchenzhumeng.github.io/posts/Nginx%E5…