将定制的 cordova 插件添加到 IBM Worklight 6.1

Posted 2023-02-25

【中文标题】将定制的 cordova 插件添加到 IBM Worklight 6.1

【英文标题】：Add custom cordova plugin to IBM Worklight 6.1

【发布时间】：2014-05-16 21:08:43

【问题描述】：

我正在尝试为 ios 平台添加自定义 Cordova 插件，当我将其与在 Cordova 上添加插件的过程进行比较时遇到了一些问题。

我在这里尝试使用的插件是https://github.com/phonegap-build/StatusBarPlugin

使用cordova我以前只是简单地使用命令行cordova plugin add com.phonegap.plugin.statusbar

首先，我尝试在本机文件夹中进行修改，但我注意到如果我这样做，它可以工作，但下次我再次部署到 iOS 平台时它将被删除。 其次，我尝试在apps/myapp/iphone 或apps/myapp/common 下添加文件（插件js 文件和cordova_plugins.js 文件。），但这会导致问题：cordova_plugins.js 文件格式似乎变得不正确。

而不是这种工作格式：

cordova.define('cordova/plugin_list', function(require, exports, module) 
module.exports = [
    
        "file": "plugins/org.apache.cordova.battery-status/www/battery.js",
        "id": "org.apache.cordova.battery-status.battery",
        "clobbers": [
            "navigator.battery"
        ]
    ,
,
    
        "file": "plugins/com.phonegap.plugin.statusbar/www/statusbar.js",
        "id": "com.phonegap.plugin.statusbar.statusbar",
        "clobbers": [
            "window.StatusBar"
        ]
    
]
);

这种格式不能正常工作：

/* javascript content from worklight/cordova_plugins.js in JS Resources */
/*
* Licensed Materials - Property of IBM
* 5725-I43 (C) Copyright IBM Corp. 2006, 2013. All Rights Reserved.
* US Government Users Restricted Rights - Use, duplication or
* disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
*/
cordova.define('cordova/plugin_list', function(require, exports, module) 
module.exports = [
    
        "file": "plugins/org.apache.cordova.battery-status/www/battery.js",
        "id": "org.apache.cordova.battery-status.battery",
        "clobbers": [
            "navigator.battery"
        ]
    
]
);
/* JavaScript content from worklight/cordova_plugins.js in folder common */

/* JavaScript content from worklight/cordova_plugins.js in JS Resources */
/*
* Licensed Materials - Property of IBM
* 5725-I43 (C) Copyright IBM Corp. 2006, 2013. All Rights Reserved.
* US Government Users Restricted Rights - Use, duplication or
* disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
*/
cordova.define('cordova/plugin_list', function(require, exports, module) 
module.exports = [
    
        "file": "plugins/org.apache.cordova.battery-status/www/battery.js",
        "id": "org.apache.cordova.battery-status.battery",
        "clobbers": [
            "navigator.battery"
        ]
    ,
    
        "file": "plugins/com.phonegap.plugin.statusbar/www/statusbar.js",
        "id": "com.phonegap.plugin.statusbar.statusbar",
        "clobbers": [
            "window.StatusBar"
        ]
    
]
);

我该怎么办？我应该把这些文件放在哪里？ 添加此自定义插件的正确方法是什么，特别是如果我只想为 iOS 而不是为 android 添加它？

【问题讨论】：

我将对此进行更多研究，但根据我现在的测试，重建只会删除 plugin.js 文件，但会保留本机 Objective-C 代码和对 config.xml 的更改。所以你仍然可以使用该插件。我建议将插件 js 文件内容复制到您的主 js 文件中，以便您可以在构建之间保留它们。

关于根据设备类型使用插件，我认为最简单的方法是使用设备插件（docs.phonegap.com/en/3.0.0/cordova_device_device.md.html）根据设备类型选择使用哪个插件。

@jiachen 感谢您的建议，我尝试将cordova_plugins.js 内容添加到main.js，但似乎不起作用。我现在正在尝试使用 buildtime.sh 脚本擦除此文件，但仍有问题。对于使用设备插件，是的，我一定会这样做

最后，我使用了cordova.exec指令，因为即使我找到了解决方法，直接更新后它也不起作用。

【参考方案1】：

更新：从 MobileFirst 7.1 开始，SDK 是 now available 作为 Cordova 插件。

对于那些有兴趣将 3rd 方插件添加到他们的 MobileFirst (Worklight) 项目的人，我在下面描述了我自己的安装方法，等待 IBM 的功能发布。

这个概念本质上是：

创建一个 Cordova 项目， 添加所需的插件， 创建一个 MobileFirst 项目， 将插件文件从两个项目复制到暂存区（以便我们轻松识别它们）， 合并 config.xml 和 cordova_plugin.js 文件（即用 Cordova 项目中的插件信息补充 MobileFirst 文件）和 将暂存和修改的文件复制到 MobileFirst。

免责声明：根据接受的答案，IBM 不支持/不建议修改 cordova_plugin.js 文件。

首先，我们需要创建 Cordova 项目（加上插件）和 MobileFirst 项目（步骤 1-4）。我以 Ionic Keyboard 插件为例，不用说这种方法（创建 Cordova 项目并合并文件）适用于任何受支持的插件和目标。

## Create a directory to contain your MobileFirst project e.g. mkdir example; cd example; ##
## Create Cordova project ##
mkdir .tmp
cd .tmp/
cordova create plugins com.plugins plugins;
cd plugins/
cordova platform add ios;
cordova plugin add com.ionic.keyboard;
cd ../..
## Create mobile first project ##
mfp create hybrid
cd hybrid/
mfp add hybrid hybrid
mfp add environment iphone
## Generate native files ##
mfp build
cd ..
## Create staging ##
mkdir -p plugins/native/www/default/worklight
mkdir -p plugins/resources/mobilefirst/
mkdir -p plugins/resources/cordova/
mkdir -p plugins/hm/
## Copy config.xml ##
cp hybrid/apps/hybrid/iphone/native/config.xml plugins/resources/mobilefirst/
cp .tmp/plugins/platforms/ios/plugins/config.xml plugins/resources/cordova/
## Copy Cordova files ##
cp -R hybrid/apps/hybrid/iphone/native/www/default/worklight/ plugins/resources/mobilefirst/
## Copy plugins JS ##
cp -R .tmp/plugins/platforms/ios/www/plugins plugins/native/www/default/worklight/
cp -R .tmp/plugins/platforms/ios/www/ plugins/resources/cordova/
## Copy classes ##
cp -R .tmp/plugins/platforms/ios/Plugins/Plugins/com.ionic.keyboard/ plugins/hm/
## Delete the Cordova project as we have copied all of the artefacts we need ##
rm -R .tmp
## Create the config and cordova_plugin.js which is going to override the mfp build version ##
cp plugins/resources/mobilefirst/config.xml plugins/native/
cp plugins/resources/mobilefirst/cordova_plugins.js plugins/native/www/default/worklight/

暂存的 config.xml 和 cordova_plugins.js 文件现在可以合并（第 5 步）。

打开 plugins/resources/cordova/config.xml 文件并将功能复制到 plugins/native/config.xml 文件中。

<feature name="Keyboard">
  <param name="ios-package" onload="true" value="IonicKeyboard" />
</feature>

打开 plugins/resources/cordova/cordova_plugins.js 文件并将插件对象复制到 plugins/native/www/default/worklight/cordova_plugins.js 文件中。

  "file": "plugins/com.ionic.keyboard/www/keyboard.js",
  "id": "com.ionic.keyboard.keyboard",
  "clobbers": [
    "cordova.plugins.Keyboard"
  ]

现在我们准备将合并的文件复制到 MobileFirst 项目中（步骤 6a）。

## Copy from staging to Worklight ##
cp -R plugins/hm/ hybrid/apps/hybrid/iphone/native/Classes/

第一次复制文件时，Xcode 不会自动拾取新类，因此在 Xcode 中打开项目并右键单击 Classes 并“将文件添加到...”。添加对话框中显示的文件。

最后，我们可以将文件从 plugins/native 目录复制到 MobileFirst 项目中（步骤 6b）。不幸的是，我们需要在每次 mfp 构建后复制此目录，因为 mfp 每次都会重置 cordova_plugins.js 文件。

## Do this after every mfp build ##
rm -f hybrid/apps/hybrid/iphone/native/www/default/worklight/cordova_plugins.js
cp -R plugins/native/ hybrid/apps/hybrid/iphone/native/

完成后，将客户端代码添加到您的混合应用程序并进行测试（不要忘记在 mfp 构建后再次运行第 6 步），例如

<input type="text">

window.addEventListener('native.keyboardshow', keyboardShowHandler);

function keyboardShowHandler(e)
    alert('Keyboard height is: ' + e.keyboardHeight);

我希望本指南对您有用。我每天都在使用这个过程（尽管它是 Grunt 的一部分），并期待 IBM 发布功能。

【讨论】：

嗨@Chris，感谢您的回答！我认为如果您将其自动化（可能会创建 ant 任务左右），它应该可以工作，但我对创建校验和以稍后通过 App Authenticity Check 的过程有疑问。你测试过这个吗？

@Floydian 谢谢。我还没有通过真实性检查测试过这种方法。由于签署是在修改后进行的，这不应该成为问题；但是，正如您所建议的，加密的网络资源可能是一个问题。根据我的帖子，这是一个不受支持的 hack，因此我不鼓励这样做，除非你真的必须这样做。不过不用担心，MobileFirst 7.1 即将推出，支持 3rd 方插件！

【参考方案2】：

Worklight 6.1.0.x 尚不支持使用 plugman 或您将在纯 Cordova 应用程序中执行的任何其他过程添加预制的 Cordova 3.x 插件，包括尝试编辑您尝试编辑的文件编辑。这是当前 Worklight 版本中的一个已知限制。

我要做的是在 Worklight 中read the training material of creating Cordova plug-ins，然后获取您要添加的插件的源并复制它。

可能还有其他方法可以做到这一点，但目前没有一种方便。

【讨论】：

提供的示例直接使用了cordova.exec() 函数。我想添加一个插件模块，它的功能，就像在我的 Case StatusBar 模块中一样，具有 StatusBar.show() 和 StatusBar.hide() 等功能 我试图在 iOS Xcode 构建时擦除 cordova_plugins.js 文件，但我我现在有这个错误：cp：/Volumes/.../iphone/native/www/default/worklight/cordova_plugins.js：权限被拒绝|我在脚本中添加以下行： cp "$SRCROOT/cordova_plugins.js" "$SRCROOT/www/default/worklight/cordova_plugins.js"

您无法编辑此文件。就像我说的，如果您编写自己的插件，则无需编辑 cordova_plugins.js；阅读培训材料。您需要创建一个新插件并在 config.xml 中声明它。您可能需要对该状态栏插件进行大量编辑。它不能按原样工作。

我明白了，这可能是一个很大的限制，在这种情况下，我可以改变这个插件的用法并重写与之通信的函数，但是其他复杂的插件呢。我认为至少找到一种解决方法非常重要

我同意。这是已知的限制，将在 Worklight 的未来版本中解决。

嗨，Adar，这个限制在 Worklight 6.2.0.x 中修复了吗？我目前面临将状态栏样式设置为浅色内容的问题。你能给我提供创建cordova插件的确切链接吗？您上面提到的链接指向入门页面。

【参考方案3】：

克里斯的上述解决方案存在问题。如果您正确遵循该过程，该插件肯定会起作用，但以后会产生严重后果。例如，由于每次生成 mfp 时都会覆盖 plugins 文件夹和 cordova_plugins.js 文件，因此生成的 wlapp 文件永远不会添加插件代码。因此，如果您使用直接更新，您的代码将在您上传此 wlapp 文件后被覆盖，并且插件将停止工作。

【讨论】：

虽然您描述的场景可以通过此方法的简单扩展来解决（wlapp 文件毕竟只是 zip），但整个方法是不受支持的解决方法，并且确实有限制；例如见IBM's post。因此，您的观点说得很好。话虽如此，MobileFirst 7.1 现在随时都会发布，预计将支持 3rd 方插件，这使得这个 hack 没有实际意义。