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.mzph.cn/news/583866.shtml

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

相关文章

Python自动化测试:选择最佳的自动化测试框架

在开始学习python自动化测试之前,先了解目前市场上的自动化测试框架有哪些? 随着技术的不断迭代更新,优胜劣汰也同样发展下来。从一开始工具型自动化,到现在的框架型;从一开始的能用,到现在的不仅能用&…

鸿蒙问题之本地模拟器无法识别

今天按例打开本地模拟器,发现DevEco Studio不能检测到我的本地模拟器了。 重启了DevEco Studio和模拟器多次都无果。果断删除模拟器 然后创建一个新的,就可以成功检测到了。这应该是idea的一个bug

关于python解析mf4中二维信号数据的注意事项

python解析mf4中的信号数据一般用np.ndarray存储,但是mf4中的一个信号有时不一定是一维数据,有时会是一个二维的,没错,就是一个信号数据就是二维的,这时候,np数组的每个元素也是一个数组,这个时…

【揭秘】如何制作推拉门电子画册,轻松成为行业大咖!

​在当今数字化时代,电子画册已成为企业展示产品、服务的重要手段。与传统印刷画册相比,电子画册具有诸多优势,如易于传播、易于更新、环保低碳等。更重要的是,通过电子画册,企业可以更好地与目标受众互动,…

天津医科大学临床医学院专升本药学专业有机化学考试大纲

天津医科大学临床医学院高职升本科专业课考试大纲药学专业《有机化学》科目考试大纲 一、考试基本要求 本考试大纲主要要求考生对《有机化学》基本概念有较深入的了解,能够系统地掌握各类化合物的命名、结构特点及立体异构、主要性质、反应、来源和合成制备方法等…

相对于一般的统计学,计量经济学的特色是什么?谈Stata与计量经济学

Stata作为一种数据分析软件,高度适用于依托计量经济学的研究领域,如宏观经济学、财政学等,当然在医学等学科应用也较为广泛,在处理面板数据方面也深具特色。计量经济学是指运用概率统计方法对经济变量之间的因果关系进行定量分析的…

idea的pom.xml文件灰色删除线解决办法

以上是点击了移除module后就变成这样 如果再次对着已移除的module右键会发现有个delete,点击这个是真删了,要谨慎备份哦 解决方案:恢复误操作remove module的解决方法 idea最右边,有个Maven控件,找到要恢复的module&a…

vscode连接linux服务器

目录 下载vscode,这是微软开源软件,打开后到下载扩展页面 在下载扩展页面下载中文和ssh远程连接扩展 安装后会在左边新生成一个图标点击齿轮 选择第一个 配置连接信息 远程隧道右边刷新,等刷出来hostname的主机后 连接ip出来后&#x…

mybatisX自动生成sql语句,尝试测试方法报错

今天我使用mybatisx自定义mapper方法生成sql语句后,在测试时报错 错误是MyBatis 无法找到映射的语句(Statement)引起的 我是这样操作的,在mapper接口自定义了一个方法 然后alt加enter,自动生成sql 结果 mapper.xml文件…

骨传导耳机的原理是什么?一文读懂骨传导耳机优缺点都有哪些!

一、骨传导耳机传声原理是什么 骨传导耳机以人体骨骼为传声介质,可以将声音转化为不同频率的震动,在不经过外耳道和鼓膜的情况下,通过震动使声音经过内耳道,直接传入大脑听觉神经,与传统耳机相比,可以节省许…

Gooxi成功入选全国首批人工智能企业

日前,Gooxi成功入选由深圳市人工智能产业协会评定的全国首批36家人工智能企业之一,这是继Gooxi成功与广东未来研究院合作AI联合创新中心之后在AI行业持续深耕的又一殊荣,彰显出Gooxi在AI领域的卓越实力。 据悉,全国首批人工智能企…

第 1 场 算法季度赛 蓝桥搜狐畅游(1~5 , 7)

1、水题 2、树上dp 3、模拟 4、概率 5、拆位 6、&#xff08;是没学过的东西了...&#xff09; 7、组合数学 1. 新年快乐【算法赛】 直接模拟 #include <iostream> using namespace std; int main() {cout <<"2024 AK";return 0; } 2. 蓝桥圣诞树…

【每日一题】收集巧克力

文章目录 Tag题目来源题目解读解题思路方法一&#xff1a;枚举操作数 写在最后 Tag 【枚举】【数组】【2023-12-28】 题目来源 2735. 收集巧克力 题目解读 有长度为 n, 下标从 0 开始的整数数组 nums, 表示收集不同类型的巧克力的成本. nums[i] 表示收集类型 i 巧克力的成本…

12.28_黑马数据结构与算法笔记Java

目录 291 最长公共子序列 动态规划 分析 292 最长公共子序列 动态规划 实现 293 Leetcode 583 两个字符串删除 294 Leetcode 300 最长递增子序列 分析 295 Leetcode 300 最长递增子序列 实现 296 Catalan数 分析 297 Catalan数 实现 298 Catalan数 应用 出栈总数 299 C…

【C++】vector 基本使用(详解)

目录 一&#xff0c;vector 的介绍 二&#xff0c;vector 的定义 1&#xff0c;vector() 2&#xff0c;vector&#xff08;size_type n, const value_type& val value_type()&#xff09; 3&#xff0c;vector (const vector& x) 4&#xff0c;vector (InputIte…

PAT乙级 1025 反转链表

给定一个常数 K 以及一个单链表 L&#xff0c;请编写程序将 L 中每 K 个结点反转。例如&#xff1a;给定 L 为 1→2→3→4→5→6&#xff0c;K 为 3&#xff0c;则输出应该为 3→2→1→6→5→4&#xff1b;如果 K 为 4&#xff0c;则输出应该为 4→3→2→1→5→6&#xff0c;即…

【Redis前奏曲】初识Redis

文章目录 一.Redis的一些特性(优点)1. 在内存中存储数据2. 可编程的3. 可扩展的4.持久化5. 聚集(集群)6. 高可用Redis快的原因 二. 使用案例1.数据库2. 缓存3. 消息队列 一.Redis的一些特性(优点) 我们在上一篇博客中说到,Redis是一个在内存中存储数据的中间件.用作数据库,数据…

本地部署Python Flask并搭建web问答应用程序框架实现远程访问

文章目录 前言1. 安装部署Flask并制作SayHello问答界面2. 安装Cpolar内网穿透3. 配置Flask的问答界面公网访问地址4. 公网远程访问Flask的问答界面 前言 Flask是一个Python编写的Web微框架&#xff0c;让我们可以使用Python语言快速实现一个网站或Web服务&#xff0c;本期教程…

比起 Pandas, 你更需要 Polars:详细指南

在数据分析领域&#xff0c;Python 由于其多功能性和广泛的库生态系统而成为一种流行的语言。数据处理和分析在提取见解和做出明智决策方面发挥着至关重要的作用。然而&#xff0c;随着数据集的规模和复杂性不断增长&#xff0c;对高性能解决方案的需求变得至关重要。 有效地处…

【Docker】添加指定用户到指定用户组

运行Docker ps命令&#xff0c;报错&#xff1a;/v1.24/containers/json": dial unix /var/run/docker.sock: connect: permission denied 创建docker用户组 安装docker时默认已经创建好 sudo groupadd docker添加用户加入docker用户组 此处以用户user为例 sudo usermo…