HarmonyOS 鸿蒙应用开发(十、第三方开源js库移植适配指南)

在前端和nodejs的世界里,有很多开源的js库,通过npm(NodeJS包管理和分发工具)可以安装使用众多的开源软件包。但是由于OpenHarmony开发框架中的API不完全兼容V8运行时的Build-In API,因此三方js库大都需要适配下才能用。

移植前准备

建议在适配JS三方库前,使用[js-e2e]扫描三方库,检查是否存在node.js/web内置模块的依赖。

js-e2e工具时基于eslint进行封装,可分析出JS库代码对node.js/web浏览器的内置模块、对象的依赖及兼容ES标准版本,使用该工具,可以快速知道该库是否依赖node.js/web内置模块。

如果扫描结果不依赖node.js/web内置模块,那么,这个库将比较轻松地适配。如果大量依赖node.js/web内置组件,这时可能需要fork源库代码,进行侵入式修改,或者再找是否存在更适合的其他三方库。

JS三方库扫描工具介绍

js-e2e是基于eslint进行封装、配置规则,用于分析JS库代码对NodeJS和Web浏览器的内置模块、对象的依赖及兼容ES标准版本的工具,支持检查指定源码目录和指定三方库的兼容性。

1 使用git工具同步js-e2e代码

image.png

2 安装npm依赖包

image.png

3 安装自定义的eslint输出报告formatter,包含csv、csvsimple、vscode、vscodesimple

image.png

4 执行检查命令

image.png

注意事项

模块规范

注意将要移植使用的三方js库的模块规范,AMD、CMD、CommonJS、ES Module等模块规范,看你需要的三方库所使用的规范是哪种。

CommonJS规范主要是为了弥补JavaScript没有标准的缺陷,已达到像Python、Ruby和Java那样具备开发大型应用的基础能力,而不是停留在开发浏览器端小脚本程序的阶段。使用CommonJS规范进行开发,需要依赖Node.js环境。(例如浏览器不兼容CommonJS的根本原因,在于缺少四个Node.js环境的变量:module、exports、require、global)

AMD规范(异步模块定义)是 RequireJS 在推广过程中对模块定义的规范化产出,不是JavaScript原生支持。使用AMD规范进行开发时,需要引入RequireJS这个第三方函数库,通过define()来定义模块,采用require()语句来加载模块。

CMD(通用模块定义)是 SeaJS 在推广过程中对模块定义的规范化产出。使用CMD规范进行开发时,需要引入SeaJS这个第三方函数库。在CMD规范中,一个模块就是一个文件,使用define()语句定义模块,使用seajs.use()加载模块。

三者的区别

CommonJS规范加载模块是同步的,也就是说,只有加载完成,才能执行后面的操作。

AMD是异步加载模块,核心是预加载,先对依赖的全部文件进行加载,加载完了再进行处理。

CMD也是异步加载模块,是按需加载。AMD和CMD最大的区别是对依赖模块的执行时机不同,而不是加载时机不同,二者皆为异步加载模块。

AMD是前置依赖,在定义模块的时候就要声明其依赖的模块。

CMD是就近依赖,只有在用到某个模块的时候再去require。

模块(关键字module)

“内部模块”现在称作“命名空间”,“外部模块”现在简称为“模块”。

内部外部为一个相对概念,在ES6和Nodejs中,引入了模块的概念,即一个文件就是一个模块;“内部模块”即当前文件内的模块,“外部模块”即当前文件外的其他模块。

例如我们在TS工程下新建一个ts文件声明一个变量a,在另一个文件同样声明一个变量a,这时候会出现错误信息:

原因:因为该文件内容是对全局可见的。
解决方案:只需要通过import || export引入模块系统即可。

ES6:(TS也适用)
导出模块:export;(默认导出 export default)
导入模块:import;

CommonJS和AMD:
导出模块:module.exports 或 exports;
导入模块:require( );

为了支持CommomJS和AMD的exports,TS提供了export=语法:

ArkTS语言

HarmonyOS的ArkTS语言是一种基于TypeScript开发的语言,它专为HarmonyOS系统开发而设计。ArkTS语言结合了JavaScript的灵活性和TypeScript的严谨性,使得开发者能够快速、高效地开发出高质量的HarmonyOS应用程序。

ArkTS语言使用TypeScript语法,TypeScript是一种由微软开发的JavaScript超集语言,它支持JavaScript的所有语法,但添加了一些新的特性和语法,使开发更加可靠和高效。TypeScript最大的特点是引入了静态类型,开发者可以在编译时发现类型错误,提高代码的可维护性和可读性。

TypeScript基础知识包括基本类型、变量声明、函数、类、接口、泛型等。另外,TypeScript还支持模块化开发,可以使用ES模块规范或者CommonJS规范导入和导出模块。在实际项目开发中,统一指定采用一种模块规范,标准的ES模块规范。在移植三方的js软件时,模块规范是可能需要修改三方库源码。

鸿蒙(HarmonyOS)的ArkTS(Ark TypeScript)使用的模块规范是ES6模块规范,而不是CommonJS模块规范。

ES6模块规范(也称为ECMAScript 2015模块规范)是一种现代的模块系统,它使用importexport关键字来导入和导出模块成员。ES6模块规范支持静态导入和导出,具有更好的树摇(tree shaking)和代码拆分(code splitting)特性,有助于优化应用程序的性能和大小。

相比之下,CommonJS模块规范是一种较旧的模块系统,它使用requiremodule.exports来导入和导出模块成员。CommonJS模块规范主要用于Node.js环境,并且在一些旧的浏览器环境中也有支持。

移植范例

鸿蒙官方的三方库地址:OpenHarmony三方库中心仓

移植很简单,成功移植了几个开源三方js库,jsbn和sm-crypto,并且编写了鸿蒙的arkUI的单元测试, 测试已通过。注意老的一些js库,在ts中使用时,需要d.ts类型声明文件。这个文件可以自己编写,也可以从网址找有没有对应的参考。一些常用的js三方库几乎都有现成的d.ts类型定义文件。可以在这里找下:GitHub - DefinitelyTyped/DefinitelyTyped: The repository for high quality TypeScript type definitions.

sm-crypto仓库地址:一缕阳光116/sm-crypto

jsbn仓库地址: 一缕阳光116/jsbn

jsbn使用举例:

import jsbn from '@yyz116/jsbn'
var BigInteger = jsbn.BigInteger;
var bi = new BigInteger('91823918239182398123');
console.log(bi.bitLength()); // 67

 sm-crypto使用举例:

import {sm2} from '@yyz116/sm-crypto'
const cipherMode = 1 // 1 - C1C3C2,0 - C1C2C3,默认为1let encryptData = sm2.doEncrypt(msgString, publicKey, cipherMode) // 加密结果
let decryptData = sm2.doDecrypt(encryptData, privateKey, cipherMode) // 解密结果encryptData = sm2.doEncrypt(msgArray, publicKey, cipherMode) // 加密结果,输入数组
decryptData = sm2.doDecrypt(encryptData, privateKey, cipherMode, {output: 'array'}) // 解密结果,输出数组// 纯签名 + 生成椭圆曲线点
let sigValueHex = sm2.doSignature(msg, privateKey) // 签名
let verifyResult = sm2.doVerifySignature(msg, sigValueHex, publicKey) // 验签结果// 纯签名
let sigValueHex2 = sm2.doSignature(msg, privateKey, {pointPool: [sm2.getPoint(), sm2.getPoint(), sm2.getPoint(), sm2.getPoint()], // 传入事先已生成好的椭圆曲线点,可加快签名速度
}) // 签名
let verifyResult2 = sm2.doVerifySignature(msg, sigValueHex2, publicKey) // 验签结果// 纯签名 + 生成椭圆曲线点 + der编解码
let sigValueHex3 = sm2.doSignature(msg, privateKey, {der: true,
}) // 签名
let verifyResult3 = sm2.doVerifySignature(msg, sigValueHex3, publicKey, {der: true,
}) // 验签结果// 纯签名 + 生成椭圆曲线点 + sm3杂凑
let sigValueHex4 = sm2.doSignature(msg, privateKey, {hash: true,
}) // 签名
let verifyResult4 = sm2.doVerifySignature(msg, sigValueHex4, publicKey, {hash: true,
}) // 验签结果// 纯签名 + 生成椭圆曲线点 + sm3杂凑(不做公钥推导)
let sigValueHex5 = sm2.doSignature(msg, privateKey, {hash: true,publicKey, // 传入公钥的话,可以去掉sm3杂凑中推导公钥的过程,速度会比纯签名 + 生成椭圆曲线点 + sm3杂凑快
})
let verifyResult5 = sm2.doVerifySignature(msg, sigValueHex5, publicKey, {hash: true,publicKey,
})

其他资源

TS模块化规范与命名空间_ts命名空间不需要导入-CSDN博客

【坚果派】JS开源库适配OpenHarmony系列——第一期实操-电子发烧友网

node之sm-crypto模块,浏览器和 Node.js 环境中SM国密算法库-CSDN博客

sm-crypto: JavaScript对SM2、SM3、SM4的支持。

GitHub - JuneAndGreen/sm-crypto: 国密算法js版

TS模块化规范与命名空间_ts命名空间不需要导入-CSDN博客

GitHub - wechat-miniprogram/sm-crypto: miniprogram sm crypto library

鸿蒙HarmonyOS实战-ArkTS语言(基本语法) - 知乎

arkui_napi: Development framework for extending the JS Native Module | 原生模块扩展开发框架

OpenHarmony三方库中心仓

Codelabs: 分享知识与见解,一起探索HarmonyOS的独特魅力。 - Gitee.com

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

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

相关文章

如何找准用户真实需求,建立情感连接?

品牌如果想要长久发展,除了独特的理念以及过硬的产品质量外还需要一点,那就在于它能持续、正确的为用户创造生活幸福感。这满足了用户的真实需求,并与其产生了情感连接,从而让品牌有机会逐渐融入、改善用户的生活实现长期价值与口…

10个简单有效的编辑PDF文件工具分享

10个编辑PDF文件工具作为作家、编辑或专业人士,您可能经常发现自己在处理 PDF 文件。无论您是审阅文档、创建报告还是与他人共享工作,拥有一个可靠的 PDF 编辑器供您使用都非常重要。 10个简单适用的编辑PDF文件工具 在本文中,我们将介绍当今…

操作系统-信号量机制(整型信号量 记录型信号量)与用信号量实现进程互斥,同步,前驱关系

文章目录 信号量机制总览信号量机制整型信号量记录型信号量例子记录型信号量小结 小结 用信号量实现进程互斥,同步,前驱关系总览信号量机制实现进程互斥信号量机制实现进程同步进程同步信号量实现进程同步 信号量机制实现前驱关系小结 信号量机制 总览 …

freeRTOS总结(十五)软件定时

1,软件定时器的简介(了解) 定时器: 从指定的时刻开始,经过一个指定时间,然后触发一个超时事件,用户可自定义定时器的周期 硬件定时器: 芯片本身自带的定时器模块,硬件定…

使用dbeaver导入Excel到mysql数据库

最近业务需要将Excel导入到mysql数据库中,之前一直用的heisql,但是heidisql的导入功能太弱了,后来用了dbeaver,功能很强大。 一、安装dbeaver 首先去官网下载dbeaver社区版,社区版免费:dbeaver.io/ dbea…

FreeBSD portsnap失败留档

大约从2023.12月开始,portsnap aotu一直失败,报错: Fetching 5 metadata files... gunzip: (stdin): unexpected end of file metadata is corrupt. 这导致ports无法更新。 同时伴随的还有github连不上,初步怀疑是中美接口那边有…

3.2-媒资管理之MinIo分布式文件系统+上传图片

媒资管理 3 分布式文件系统 3.1 什么是分布式文件系统 要理解分布式文件系统首先了解什么是文件系统。 查阅百度百科: 文件系统是负责管理和存储文件的系统软件,操作系统通过文件系统提供的接口去存取文件,用户通过操作系统访问磁盘上的文…

JavaScript基础第三天

JavaScript 基础第三天 今天我们学习for循环、while循环、终止循环和无限循环。 1. for 循环 1.1. 语法 // 1. 语法格式 // for(起始值; 结束条件; 累加器) { // // 要重复执行的代码 // }1.2. 示例代码 let sum 0; for (let i 0; i < 100; i) {sum i; } alert(&q…

jsp康养小镇管理系统Myeclipse开发mysql数据库web结构java编程计算机网页项目

一、源码特点 JSP康养小镇管理系统是一套完善的java web信息管理系统&#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。开发环境为TOMCAT7.0,Myeclipse8.5开发&#xff0c;数据库为Mysql5.0&a…

[超分辨率重建]ESRGAN算法训练自己的数据集过程

一、下载数据集及项目包 1. 数据集 1.1 文件夹框架的介绍&#xff0c;如下图所示&#xff1a;主要有train和val&#xff0c;分别有高清&#xff08;HR&#xff09;和低清&#xff08;LR&#xff09;的图像。 1.2 原图先通过分割尺寸的脚本先将数据集图片处理成两个相同的图像…

LeetCode 491 递增序列

给定一个整型数组, 你的任务是找到所有该数组的递增子序列&#xff0c;递增子序列的长度至少是2。 示例: 输入: [4, 6, 7, 7] 输出: [[4, 6], [4, 7], [4, 6, 7], [4, 6, 7, 7], [6, 7], [6, 7, 7], [7,7], [4,7,7]]说明: 给定数组的长度不会超过15。 数组中的整数范围是 [-…

JavaScript中call、apply、bind方法的应用与区别

在JavaScript中&#xff0c;call、apply和bind是函数的三个重要方法&#xff0c;它们虽然功能不同&#xff0c;但都可以用来改变函数的执行上下文或者传递参数。本文将分别介绍call、apply和bind方法的应用和区别&#xff0c;并附带示例代码。 一、call方法 call方法的作用是…

Linux bind命令教程:打造你的定制化Linux命令快捷键(附案例详解和注意事项)

Linux bind命令介绍 bind命令在Linux系统中&#xff0c;用于显示或设置键盘的按键与内部函数或字符串之间的绑定。在我们使用命令行工作时&#xff0c;根据我们的习惯&#xff0c;可以自定义命令的快捷键&#xff0c;使得工作更加便捷。 Linux bind命令适用的Linux版本 bind…

Spring GateWay

概述简介 能干什么 反向代理 鉴权 流量控制 熔断 日志监控 Spring Cloud Gateway 与Zuul的区别 在SpringCloud Finchley正式版之前&#xff0c;Spring Cloud推荐的网关是 Netflix提供的Zuul: 1、Zuul 1.x&#xff0c;是一个基于阻塞Ⅳ/O的APl Gateway 2、Zuul 1.x基于Servl…

dreamtalk 学习笔记

目录 依赖项&#xff1a; 加载音频&#xff1a; pyav报错 已经开源&#xff1a; GitHub - shubham-dayma/dreamTalk 依赖项&#xff1a; 加载音频&#xff1a; pip install pysoundfile pip install av pyav报错 pip install PyAV av.codec.codec.UnknownCodecError: …

操作字符串之提取字串-5-expr “$string“ : ‘\($substring\)‘

1.expr "$string" : \($substring\) 从$string的开始位置提取$substring&#xff0c;其中$substring是正则表达式 2.实例 操作字符串样例&#xff1a;stringabc123ABC456xyz 索引下标从1开始 123456789............. 字符串操作默认从左边开始进行 2.1.从$strin…

如何保持mac苹果电脑系统在最佳状态?不卡顿

苹果电脑一直以其卓越的性能和用户友好的操作系统而备受欢迎。然而电脑上的文件、应用程序和缓存可能会逐渐积累&#xff0c;导致性能下降。为了确保你的苹果电脑保持最佳状态&#xff0c;高效清理是至关重要的一步。在本文中&#xff0c;我们将分享一些如何清理苹果电脑更高效…

npm 上传一个自己的应用(1) 搭建一个项目环境

上文 在npm官网中注册一个账号并登录 带着大家创建了一个npm账号 我们先登录官网 然后 我们在自己电脑中创建一个文件夹 这个文件夹叫什么没有太大所谓 我这里直接叫 grnpmtext 然后 我们在这个文件夹中初始化一个项目 终端输入 npm initpackage name 要我们输入项目的名称 …

Java项目使用jasypt加密和解密配置文件中关键信息

一、使用背景 项目中application.yml 配置文件中&#xff0c;如数据库、redis、加密算法的私钥等各种配置的username&#xff0c;password的值都是明文的&#xff0c;其实存在一定的安全隐患&#xff0c;如果被人拿到这些配置文件&#xff0c;将直接对系统安全构成极大威胁&…

imgaug数据增强神器:增强器一览

官网&#xff1a;imgaug — imgaug 0.4.0 documentationhttps://imgaug.readthedocs.io/en/latest/ github:GitHub - aleju/imgaug: Image augmentation for machine learning experiments. imgaug数据增强神器&#xff1a;增强器一览_iaa 图像增强改变颜色-CSDN博客文章浏览阅…