使用Cordova将网址/网页打包APP

本来买的 vps 闲着，然后部署了个 H5 的游戏，又想着 ip 访问不方便，就想打包 APP。网上搜了一下，在线打包好多都花钱，本地的，装HBuilderX或者Android Studio，后来 AI 告诉我 Cordova 可以，是Node.js的一个工具Node.js我本地倒是有，安装也不麻烦，使用倒是还行，但是还要安装一堆的环境。我手上有docker，原来已经有人打包好Cordova安卓环境了，直接用就行，docker还能当工具用，我也是第一次知道这么玩。

1. 环境

在dokerhub 和 github 上找了一圈，试验了几个环境，内部的版本比较老，导致各种失败，终于找到了一个能用的:

命令如下：

docker run -it -v "$(pwd)":/opt/src --rm hamdifourati/cordova-android-builder bash
  • –rm 就是使用后删除，容器退出后就删除实例了
  • $(pwd) 是取当前目录，这里会创建cordova的工作目录，指定目录也行，把引号去掉，如果是静态的文件包含index.html的就很方便
  • 最后的 bash 是进入该容器实例控制台的意思，就是所有的操作都在 cordova 容器内部

2. 补丁

进入到容器后，会到默认的/opt/src 目录，这里就印射的本地目录，但是还得打补丁才能用（注意这里都是容器内部），一遍一遍试才总结出来的:

#sdkmanager包升级
sdkmanager "platforms;android-34"
sdkmanager "build-tools;34.0.0"
 
#java环境
#https://www.oracle.com/java/technologies/javase/jdk17-archive-downloads.html
wget https://download.oracle.com/java/17/archive/jdk-17.0.12_linux-x64_bin.deb
dpkg -i jdk-17.0.12_linux-x64_bin.deb
export JAVA_HOME=/usr/lib/jvm/jdk-17.0.12-oracle-x64
export PATH=$JAVA_HOME/bin:$PATH
 
#vim 酌情安装
#apt-get install -y vim

3. 打包

到这就可以正式用了，

  • 基本命令：
#创建项目
cordova create MyApp
cd MyApp
 
#部署环境
cordova platform add android
 
#构建
cordova build android

最后会提示成功，第一次会很慢，后面就好了，去印射的路径$(pwd)拿就行了

如果不用了，使用exit退出

  • 允许HTTP（默认https）
vim platforms/android/app/src/main/AndroidManifest.xml
#android:usesCleartextTraffic="true"
<application android:hardwareAccelerated="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:supportsRtl="true" android:usesCleartextTraffic="true">
  • 配置
vim config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget id="io.cordova.hellocordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <!-- APP的名 -->
    <name>XYAPP</name>
    <description>Sample Apache Cordova App</description>
    <author email="dev@cordova.apache.org" href="https://cordova.apache.org">
        Meixianghao
    </author>
    <!-- 直接跳转的地址，默认是index.html -->
    <content src="http://XXX:8889/" />
     <!-- 设置为竖屏应用 -->
    <preference name="Orientation" value="portrait" />
    <!-- 允许HTTP内部跳转 默认是浏览器打开 -->
    <allow-navigation href="http://*/*" /> 
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
</widget>

后续还要配置图标，启动页面，等，目前我用不上

4. 新的构建

由于每次进入都要打补丁，我本地又构建了一个，没上传，这里是 Dockerfile

#https://hub.docker.com/_/openjdk
ARG OPENJDK_VERSION=17
FROM eclipse-temurin:${OPENJDK_VERSION}
 
# Reference default value
ARG OPENJDK_VERSION
#https://github.com/nodesource/distributions/blob/master/README.md
ARG NODEJS_VERSION=20
#https://gradle.org/releases/
ARG GRADLE_VERSION=8.7
#https://www.npmjs.com/package/cordova?activeTab=versions
ARG CORDOVA_VERSION=12.0.0
#https://developer.android.com/studio#command-tools
ARG ANDROID_CMDTOOLS_VERSION=11076708
 
 
LABEL maintainer="Hamdi Fourati <contact@hamdifourati.info>"
 
WORKDIR /opt/src
 
ENV JAVA_HOME /opt/java/openjdk/
ENV ANDROID_SDK_ROOT /usr/local/android-sdk-linux
ENV ANDROID_HOME $ANDROID_SDK_ROOT
ENV GRADLE_USER_HOME /opt/gradle
ENV PATH $PATH:$ANDROID_SDK_ROOT/platform-tools:$ANDROID_SDK_ROOT/cmdline-tools/latest/bin:$GRADLE_USER_HOME/bin
 
# Tools
RUN apt update && apt -qq install -y git
 
# NodeJS
RUN echo https://deb.nodesource.com/setup_${NODEJS_VERSION}.x
RUN curl -sL https://deb.nodesource.com/setup_${NODEJS_VERSION}.x | bash -
RUN apt -qq install -y nodejs
 
# Cordova
RUN npm i -g cordova@${CORDOVA_VERSION}
 
# Gradle
RUN apt -qq install -y unzip
RUN curl -so /tmp/gradle-${GRADLE_VERSION}-bin.zip https://downloads.gradle.org/distributions/gradle-${GRADLE_VERSION}-bin.zip && 
    unzip -qd /opt /tmp/gradle-${GRADLE_VERSION}-bin.zip && 
    ln -s /opt/gradle-${GRADLE_VERSION} /opt/gradle
 
# Android
RUN curl -so /tmp/commandlinetools-linux-${ANDROID_CMDTOOLS_VERSION}_latest.zip https://dl.google.com/android/repository/commandlinetools-linux-${ANDROID_CMDTOOLS_VERSION}_latest.zip && 
    mkdir -p $ANDROID_SDK_ROOT/cmdline-tools/ && 
    unzip -qd $ANDROID_SDK_ROOT/cmdline-tools/ /tmp/commandlinetools-linux-${ANDROID_CMDTOOLS_VERSION}_latest.zip && 
    mv $ANDROID_SDK_ROOT/cmdline-tools/cmdline-tools $ANDROID_SDK_ROOT/cmdline-tools/latest
 
# 打补丁
RUN sdkmanager "platforms;android-34"
RUN sdkmanager "build-tools;34.0.0"
RUN wget https://download.oracle.com/java/17/archive/jdk-17.0.12_linux-x64_bin.deb
RUN dpkg -i jdk-17.0.12_linux-x64_bin.deb
RUN export JAVA_HOME=/usr/lib/jvm/jdk-17.0.12-oracle-x64
RUN export PATH=$JAVA_HOME/bin:$PATH
RUN apt-get install -y vim
 
# Update and accept licences
COPY android.packages android.packages
RUN ( sleep 5 && while [ 1 ]; do sleep 1; echo y; done ) | sdkmanager --package_file=android.packages

android.packages

platforms;android-34
build-tools;34.0.0

相关文章