cordova后台插件开发新手教程


typora-root-url: imags

cordova后台插件开发新手教程

预安装环境:JDK11、Android studios、nodo.js

一、环境搭建

1.安装Cordova

复制代码
 npm install -g cordova

2.创建项目 cordova create

具体命令: cordova create 目录名 包名 项目名

执行结果终端:

复制代码
D:\01work_file\05demo
λ  cordova create smartTest com.kemov.smartTest smartTest
Creating a new cordova project.

D:\01work_file\05demo
λ ls
smartTest/

D:\01work_file\05demo
λ cd smartTest\

D:\01work_file\05demo\smartTest  (com.kemov.smarttest@1.0.0)
λ ls
config.xml  package.json  www/

3.添加平台

复制代码
D:\01work_file\05demo\smartTest  (com.kemov.smarttest@1.0.0)
λ cordova platform add android@^10.0.0
Using cordova-fetch for cordova-android@10.0.0
Adding android project...
Creating Cordova project for the Android platform:
        Path: platforms\android
        Package: com.kemov.smartTest
        Name: smartTest
        Activity: MainActivity
        Android target: android-30
Subproject Path: CordovaLib
Subproject Path: app
Android project created with cordova-android@10.0.0
Discovered plugin "cordova-plugin-whitelist". Adding it to the project
Installing "cordova-plugin-whitelist" for android
Plugin doesn't support this project's cordova-android version. cordova-android: 10.0.0, failed version requirement: >=4.0.0 <10.0.0
Skipping 'cordova-plugin-whitelist' for android
Adding cordova-plugin-whitelist to package.json

D:\01work_file\05demo\smartTest  (com.kemov.smarttest@1.0.0)
λ ls
config.xml  node_modules/  package-lock.json  package.json  platforms/  plugins/  www/

4.通过AS软件打开android项目并编译APK

4.1 AS软件> File > open > 选择./platforms/android文件路径 > ok

4.2 等待gradle环境初始化完成 > Build> Build APK

二、后台插件开发及调试

1.自定义插件创建

复制代码
D:\01work_file\05demo\smartTest  (com.kemov.smarttest@1.0.0)
λ plugman create --name SmartTestPlugin  --plugin_id com.kemov.smartTest  --plugin_version 1.0.0

D:\01work_file\05demo\smartTest  (com.kemov.smarttest@1.0.0)
λ ls 
SmartTestPlugin/  config.xml  node_modules/  package-lock.json  package.json  platforms/  plugins/  www/

D:\01work_file\05demo\smartTest\SmartTestPlugin
λ plugman platform add --platform_name android

D:\01work_file\05demo\smartTest\SmartTestPlugin
λ ls
plugin.xml  src/  www/

D:\01work_file\05demo\smartTest\SmartTestPlugin
λ npm init -yes
Wrote to D:\01work_file\05demo\smartTest\SmartTestPlugin\package.json:

{
  "name": "smarttestplugin",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

cordova plugin add SmartTestPlugin

2.后台调试

2.1 前端(html、js)按钮点击事件;

index.html

复制代码
<button style="width: 100px; height: 50px; margin: 20px;" id="exportDocx">导出wordl</button>

js点击时间监听处理

复制代码
 document.getElementById("exportDocx").addEventListener('click', function () {
		// Todu
        });
2.2 传递参数处理

​ 简单数据接口直接代码定义,复杂的数据把数据的json写到txt中

复制代码
 fetch('test/table.txt')
     .then(response => response.text())
     .then((data) => {
     	console.log("_wd111  1 " + data);
     	cordova.plugins.exportPlugin.exportDocx((data),
         (m) => {
            console.log("_wd callback sucsses" + m);
         },
         (e) => {
             console.error("_wd callback error " + e);
         });
     })
     .catch(error => console.log(error));

三、前后端联调

1.联调

1.1 后台提供逻辑代码的jar包

1.2 插件入口类

1.3 依赖配置,AndroidManifest.xml文件相关配置修改项

2.jar打包文件

​ 编译后的插件文件打jar包(不报含插件入口类)

步骤:

  • 编译apk

  • 在终端中 进入本项目 build/intermediates/javac/debug/classes 中

  • 执行命令 jar -cvf class.jar com/kemov/smartTest/entry

    D:\01work_file\gitworkspace\smartTestPlugin\smartTest\platforms\android\app\build\intermediates\javac\debug\classes (dev_1.0 -> origin)
    λ pwd
    D:\01work_file\gitworkspace\smartTestPlugin\smartTest\platforms\android\app\build\intermediates\javac\debug\classes

    D:\01work_file\gitworkspace\smartTestPlugin\smartTest\platforms\android\app\build\intermediates\javac\debug\classes (dev_1.0 -> origin)
    λ jar -cvf class.jar com/kemov/smartTest/entry
    已添加清单
    正在添加: com/kemov/smartTest/entry/(输入 = 0) (输出 = 0)(存储了 0%)
    正在添加: com/kemov/smartTest/entry/ExportCell.class(输入 = 2802) (输出 = 1039)(压缩了 62%)
    正在添加: com/kemov/smartTest/entry/Table.class(输入 = 2588) (输出 = 968)(压缩了 62%)
    正在添加: com/kemov/smartTest/entry/Task.class(输入 = 1924) (输出 = 733)(压缩了 61%)

    D:\01work_file\gitworkspace\smartTestPlugin\smartTest\platforms\android\app\build\intermediates\javac\debug\classes (dev_1.0 -> origin)
    λ ls
    class.jar com/

生成的 .jar文件可以用反编译器查看下

3.同步相关依赖

后台第三依赖在smartTest/platforms/android/app/build.gradle

复制代码
dependencies {
    implementation fileTree(dir: 'libs', include: '*.jar')
    implementation "androidx.appcompat:appcompat:${cordovaConfig.ANDROIDX_APP_COMPAT_VERSION}"

    implementation 'org.apache.poi:poi-ooxml:5.2.3'
    implementation 'org.apache.poi:poi:5.2.3'
    implementation 'org.apache.poi:poi-scratchpad:5.2.3'
    implementation 'com.google.code.gson:gson:2.8.7'

    if (cordovaConfig.IS_GRADLE_PLUGIN_KOTLIN_ENABLED) {
        implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:${cordovaConfig.KOTLIN_VERSION}"
    }

    // SUB-PROJECT DEPENDENCIES START
    implementation(project(path: ":CordovaLib"))
    // SUB-PROJECT DEPENDENCIES END
}

四、常见问题

**问题1:**第三方poi jar包与sdk最小支持版本26

**处理: **在cdv-gradle-config.json修改最小sdk版本配置 "MIN_SDK_VERSION": 26,

android版本权限问题由一开始的静态权限,后续是动态权限申请。

五、附录

1.cordova版本,Android VersionLibrary & Tooling Version版本适配

https://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html

2.Android Gradle Plugin与Gradle版本、JDK版本对应关系

oid版本权限问题由一开始的静态权限,后续是动态权限申请。

五、附录

1.cordova版本,Android VersionLibrary & Tooling Version版本适配

https://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html

2.Android Gradle Plugin与Gradle版本、JDK版本对应关系

https://blog.csdn.net/qq_42690281/article/details/131643663

相关推荐
饕餮争锋2 小时前
设计模式笔记_创建型_建造者模式
笔记·设计模式·建造者模式
萝卜青今天也要开心2 小时前
2025年上半年软件设计师考后分享
笔记·学习
吃货界的硬件攻城狮2 小时前
【STM32 学习笔记】SPI通信协议
笔记·stm32·学习
蓝染yy3 小时前
Apache
笔记
lxiaoj1114 小时前
Python文件操作笔记
笔记·python
半导体守望者4 小时前
ADVANTEST R4131 SPECTRUM ANALYZER 光谱分析仪
经验分享·笔记·功能测试·自动化·制造
啊我不会诶5 小时前
倍增法和ST算法 个人学习笔记&代码
笔记·学习·算法
逼子格6 小时前
振荡电路Multisim电路仿真实验汇总——硬件工程师笔记
笔记·嵌入式硬件·硬件工程·硬件工程师·硬件工程师真题·multisim电路仿真·震荡电流
一条破秋裤6 小时前
一份多光谱数据分析
笔记·数据挖掘·数据分析
zstar-_6 小时前
【算法笔记】6.LeetCode-Hot100-链表专项
笔记·算法·leetcode