Cordova 插件

插件可以定义为一段附加代码，用于使 Cordova Web 视图能够与原生平台进行通信。它可以为原生组件提供 JavaScript 接口。此外，它是一个可重用组件，负责定义应用程序的原生设备和平台功能之间的连接，例如相机、GPS 等。Cordova API 的所有主要功能都通过插件实现。有许多插件可用，可实现 Cordova 的功能，例如条形码扫描仪、GPS 等。

对于每个支持的平台，插件都包含一个单一的 JavaScript 接口以及一个原生代码库。这个 JavaScript 接口可以隐藏各种原生代码实现。我们还可以创建自己的插件，并将工作成果与多个节点共享。

在 Cordova 开发领域，我们可以将插件定义为 Apache 框架中最强大的工具之一。此外，它负责实现所有主要的 Cordova API 功能。所有可用插件都可以在Cordova 插件搜索页面上搜索到，该页面提供了条形码扫描仪、NFC 通信等功能。

Cordova 插件包含什么？

Cordova 插件为原生组件提供 JavaScript 接口。这些插件包含各种元素，如下所示：

• 通用 JavaScript 接口
• 一个清单文件，即XML
• 原生代码

Cordova 插件的基本结构

Cordova 插件的基本结构从上到下定义了包含目录的层次结构。

- 插件顶级文件夹

— plugin.xml

— src/

— android/

<Java 源代码>

— ios/

<Objective-C 源代码>

— www/

<JavaScript 接口>

-package.json — 与节点包相同，用于存储应用程序的元数据，如包名、版本号、描述等。

-README.md — npmjs 网站的文档。

-libs

— android/

— <包含 Android 库>

— ios/

— <包含 iOS 库>

-hooks

- 此目录指定可以在各种插件/应用程序生命周期事件中执行的脚本。

Cordova 插件如何工作？

Cordova 包含一个位于 JavaScript 和原生代码之间的桥梁。该桥梁负责使用户能够通过通用的 JavaScript 接口编写原生代码。

Cordova 桥还用于将插件 JavaScript 接口暴露的所有特定方法映射到插件的原生代码。您可以在 JavaScript 和原生方法之间传递任何方法的参数。

在此，我们定义了一些与传递的参数一起使用的函数

• function(winParam) {}: 这是一个成功回调函数，可以与任何传递的参数一起执行。
• function(error) {}: 这是一个错误回调函数，在操作未成功完成时执行。
• "action": 它指的是在原生端调用的操作名称。
• [/* arguments */]: 它包含一个传递到原生代码的参数数组。
• "service": 它主要定义要在原生端调用的服务名称。

Cordova 插件命令

语法

Plugin-spec

我们可以通过以下通用语法来指定各种 Cordova 插件：

语法

<plugin-spec> : [@scope/]pluginID[@version]|directory|url[#commit-ish][:subdir]

解析插件的算法

当我们想在项目中添加新插件时，命令行界面可以通过以下标准来解析插件。

• 首先，您必须在命令提示符中传递 plugin-spec 命令。
• 然后，plugin-spec 将保存到应用程序的 xml 和 package.json 文件中。
• 保存文件后，我们可以将最新插件版本发布到 npm，这是我们当前项目支持的。这仅适用于包含其 Cordova 依赖项在 json 中的插件。
• 最后，最新版本的插件将被发布到 npm。

冲突的插件

在使用应用程序的插件时，可能会发生一些冲突，如下所示：

• 当添加使用其 plugin.xml 文件中的 edit-config 标签的新插件时，可能会发生冲突。此标签主要用于添加或替换 XML 元素的属性。
• 如果多个插件尝试操作同一个 XML 元素，则会反映出应用程序的问题。当发生任何冲突时，它可以通过实现冲突检测方案来检测。此方案有助于阻止插件被添加，因此一个插件不会尝试覆盖另一个插件的 edit-config。

如果发现 edit-config 中的任何冲突，也可能出现错误消息。此消息会阻止插件被添加到平台。在将插件添加到平台之前，必须解决所有冲突。解决 edit-config 冲突的一个可能选项是修改受影响的 plugin.xml，以便不能修改相同的 XML 元素。我们还可以使用替代方法使用 --force 标志强制添加插件。此方法会忽略冲突检测，并用另一个插件覆盖所有冲突，因此应谨慎使用。

安装 Cordova 插件

要为我们的应用程序安装 Cordova 插件，我们必须遵循一些手动步骤，如下所示：

• 首先，请确保我们的系统中已安装 Cordova CLI。如果未安装，请在命令提示符中键入以下命令：

npm install -g cordova

• 在单独的目录中创建一个新的 Cordova 项目。

cordova create cordova-app

• 我们可以添加应用程序运行所需的目标平台。在此之前，我们必须将默认目录更改为已安装应用程序的位置。键入以下命令：
  cd cordova-app
  添加平台
  cordova platform add android
  cordova platform add ios
• 现在，搜索您需要的插件并通过以下命令安装它们：

cordova plugin search camera

    cordova plugin add com.cordova.plugin.camera

• 最后，构建 Cordova 应用程序
  cordova build android
  cordova build ios

构建插件

开发人员使用 CLI 的plugin add 命令将新插件添加到项目中。我们可以将 git 存储库的 URL 作为参数传递给这些命令。此参数包含插件代码。例如，请参阅以下命令：

cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git

上面的命令通过将 git 存储库的 URL 作为参数来实施 Cordova 设备 API。

应该注意的是，插件存储库必须包含一个顶级的 plugin.xml 清单文件。有多种方法可用于配置清单文件。您可以在官方插件规范页面上查看可用插件。以下代码提供了Device插件版本的基本示例：

让我们更好地理解以下代码。在代码的第三行，我们定义了 plugin 标签的 id 属性，该属性主要包含相同的反向域名格式，用于确定插件包。

• 在上面的代码中，js-module 标签用于确定通用 JavaScript 接口的路径。
• 我们使用 platform 标签来指定对应的原生代码集。这里，我们使用了 android。
• config-file 标签也用于封装一个 feature 标签，该标签将被注入到特定于平台的 xml 文件中。
• 这里，我们还使用了 header-file 和 source-file 标签，它们主要定义了库组件文件的路径。

使用 Plugman 验证插件

我们可以将 Plugman 定义为用于安装和卸载插件的命令行工具。plugman 工具可确保插件是否为每个平台正确安装。

npm install –g plugman

上面的命令用于在系统上安装 plugman。

我们还需要一个有效的应用程序源目录。然后运行特定命令以确保 iOS 依赖项已正确加载。

plugman install --platform ios --project /path/to/my/project/www --plugin /path/to/my/plugin

发布插件

如果您想将插件发布到任何基于 npmjs 的注册表中，首先，您应该在系统上安装plugman CLI。在上一节中，我们指定了安装 plugman CLI 的命令。如果您的系统中未安装，您可以参考它。

然后，为您的插件创建一个 package.json 文件。此文件与节点包相同，用于存储应用程序的元数据，如包名、版本号、描述等。

$ plugman createpackagejson /path-of-the-plugin

如果您没有 npm 账户，则必须在发布插件之前创建一个账户。最后，通过键入以下命令发布您的插件：

$ npm publish /path-of-the-plugin

插件 API

有不同套的 Cordova 插件可供您的应用程序使用。其中一些如下：

• camera: 此插件用于提供一个接口来启用设备摄像头。它还可以从设备存储中选择图像。
• contacts: 它允许访问设备联系人。
• device: 它提供了一个接口来检索有关硬件和软件的信息。
• file: 它启用对设备文件的读/写访问。
• file-opener2: 它使用默认应用程序打开系统上的特定文件。
• file-transfer: 它用于将文件上传/下载到设备或从设备下载文件。
• geolocation: 它用于访问 GPS 数据并显示设备的当前位置，如纬度和经度。
• statusbar: 当我们运行应用程序时，它提供了一个接口来更改状态栏的行为。
• push: 它用于接收原生推送通知。
• barcodescanner: 它负责使用设备摄像头扫描条形码。
• customurlscheme: 它允许我们的应用程序通过 URL 启动，例如 myapp://path?foo=bar。
• emm-app –config: 此插件主要检索企业移动管理 (EMM)。

插件注意事项和兼容性

Cordova 中使用的插件在质量和实现方面有所不同。某些插件与名为 Astro 的 WordPress 主题兼容性更好。如果插件需要显示自己的 UIViewController，则呈现的 UI 插件应能正常工作。

如果这些插件手动将 UIViews 集成到视图层次结构中，则某些插件可能无法正常工作。原因在于托管 Cordova JavaScript 的 UIWebView 永远不可见。插件需要进行更改才能使用 presentViewController()。

这些插件也可能发生冲突并显示错误。因此，我们应该仅从 app.js 使用 Cordova 插件。