移动端打包

本文档提供了将平台应用封装为 iOS 应用的详尽步骤，封装安卓应用也可参考本文档。

准备工作

开始之前，请确认您的开发环境符合以下要求：

  • 搭载最新 macOS 系统的 Mac 电脑。

Alt text

  • 安装了最新版 Node.js。

    ➜  ~ node -v
    v16.20.2
  • 已安装 Xcode（iOS 开发所需），可从 Mac App Store 获取。

Alt text

安装 Cordova 并创建 iOS 项目

通过 npm 安装 Cordova CLI，并创建新的 iOS 项目：

# 安装Cordova命令行工具
npm install -g cordova
# 创建新的iOS应用项目
cordova create MyApp

cd MyApp
# 为项目添加iOS平台支持
cordova platform add ios
cordova prepare ios

npm install
# 演示添加插件，实际插件按需添加
cordova plugin add cordova-plugin-battery-status
cordova plugin add cordova-plugin-device

执行上述命令后，一个含 iOS 原生项目的 Cordova 工程将被创建。

Alt text

使用 Xcode 配置和启动项目

  • 利用 Xcode 打开您的 HelloCordova 项目。

Alt text

  • 请确保选中项目 Project，而非库 Library。

Alt text

  • 将启动页 URL 修改为您的应用地址。

Alt text

请注意，必须对两个 config 文件都进行修改。

Alt text

修改代码段如下：

<content src="您的应用URL" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />

<!-- 允许WebView导航至任意URL -->
<allow-navigation href="https://*/*" />

<!-- 配置可处理的URL模式 -->
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />

测试项目

按照以上配置，可以在 Xcode 中选择模拟器进行项目测试。 Alt text 选择合适的模拟设备，点击运行图标，模拟器将自动启动并打开您配置的网址。 Alt text 大多数浏览器特性应能在模拟器中正常工作。

高级配置：插件集成

原生 iOS 应用可能需要访问特殊功能，例如摄像头、通讯录、蓝牙或地理位置，这可以通过集成 Cordova 插件实现。

安装所需插件

  • 具体插件的安装请参照上文指南。
  • 插件的选择、能力及API，可通过插件市场、GitHub 或自行开发获取。
  • 官方插件列表：Cordova Plugins

将插件 JS SDK 集成至应用 JS

  • 在目标应用的 IDE 中，将 Xcode 工程的 www 目录内部分内容复制到平台的 cordova 目录中。

这两个文件及 plugins 目录在安装插件后会自动生成。

Alt text

确保这些文件被复制到应用的 cordova 目录中（如果没有此目录，请创建一个）。

Alt text

  • 在应用的 app.js 中添加 Cordova 加载脚本。

Alt text

示例加载代码：

(function loadCordova() {
    let head = document.getElementsByTagName('head')[0];
    let script = document.createElement('script');
    script.type = 'text/javascript';
    script.charset = 'utf-8';
    script.async = true;
    script.src = "./mobile/cordova/cordova.js";
    head.appendChild(script);
})();
  • 确认代码无误后，发布企业门户 entry。此时，插件功能已完全集成至平台。
  • 在需要使用插件 API 的页面，根据插件文档直接进行调用。

Alt text

如上图所示，已可以调用 device 和 battery 插件的 API。

将应用发布至 iOS App Store

应用开发完毕且准备上架 App Store 时，需要按照 Apple 的发布指南构建发布版本，并通过 Xcode 提交至 App Store Connect。

此指南仅提供了封装 Cordova iOS 应用的基础步骤。请参考 Cordova 的官方文档及 Apple 的发布指南了解更多细节和高级配置。

results matching ""

    No results matching ""