【Cordova】cordova环境变量配置及安装

谁践踏了优雅 2022-05-09 14:08 559阅读 0赞

## 1 配置环境变量 ##

### 1.1 安装jdk ###

1.  系统变量→新建 JAVA\_HOME 变量 。  
    　　变量值填写jdk的安装目录（本人是 D:\\Program Files\\Android\\jdk)  
    　　![在这里插入图片描述][70]
2.  系统变量→新建 CLASSPATH变量  
    输入.;%JAVA\_HOME%\\lib\\dt.jar;%JAVA\_HOME%\\lib\\tools.jar  
    ![在这里插入图片描述][70 1]
3.  系统变量→编辑PATH的变量  
    输入：%JAVA\_HOME%\\bin;%JAVA\_HOME%\\jre\\bin;  
    ![在这里插入图片描述][70 2]

### 1.2 安装sdk ###

1.  用户变量→新建ANDROID\_HOME变量  
    输入：变量值填写jdk的安装目录（本人是D:\\sdk)  
    ![在这里插入图片描述][70 3]
2.  用户变量→编辑PATH的变量  
    输入：%ANDROID\_HOME%\\platform-tools  
    ![在这里插入图片描述][70 4]
3.  系统变量→编辑PATH的变量  
    输入：% JAVA\_HOME%\\ bin  
    ![在这里插入图片描述][70 5]

## 2 安装创建 ##

### 2.1 安装cordova ###

npm install -g cordova

### 2.2 创建cordova项目 ###

cordova create cordovaApp com.cordovaApp.app cordovaApp

> 说明：第一个cordovaApp 表示文件夹的名称  
> 第二个com.cordovaApp .app 表示项目id  
> 第三个cordovaApp 表示项目名称

cd cordovaApp //转到你创建的目录
     cordova platform add android//添加构建app的平台

### 2.3 打包构建（测试使用apk） ###

cordova build android

> 生成apk地址：platforms\\android\\app\\build\\outputs\\apk\\debug

### 2.4 打包带签名的apk ###

2.4.1 生成不带签名的apk

cordova build --release android

> 生成的文件名称是:app-release-unsigned.apk  
> 2.4.2 在生成apk的目录下（只是便于查找），生成签名

keytool -genkeypair -alias demo.keystore -keyalg RSA -validity 4000 -keystore demo.keystore

> 将name替换成你所需要的生成签名文件的名称

> 这里需要注意，当你输入keytool时，可能会出现  
> ![在这里插入图片描述][70 6]  
> 有可能时因为你的环境变量配置的有问题，你也可以将所在目录下的执行文件拖入cmd中，如果你使用的是git也可以直接使用keytool（我自己的是乱码，但是不影响使用，对应的输入信息是一样的）  
> ![在这里插入图片描述][70 7]

输入命令：

"D:\Program Files\Android\jdk\jre\bin\keytool.exe" -genkeypair -alias test.keystore -keyalg RSA -validity 4000 -keystore test.keystore

将会输入一些信息：这里会要求输入两次密码，作为之后你使用签名的凭证  
![在这里插入图片描述][70 8]  
![在这里插入图片描述][70 9]

2.4.3 使用签名生成带签名的apk

jarsigner -verbose -keystore name.keystore -signedjar name.apk

*  name\_unsigned.apk name.keystore
 *  name.keystore 替换成 你所生成的签名文件 我的就是test.keystore
 *  name.apk 的name替换成你所需要生成的apk的名称 我这边是test
 *  name\_unsigned.apk 替换成未带签名的apk 我这边就是 app-release-unsigned.apk

> 这里需要注意，当你输入jarsigner时，可能会出现和keytool一样的问题，操作方式也是相同的  
> 输入命令：

"D:\Program Files\Android\jdk\bin\jarsigner.exe" -verbose -keystore test.keystore -signedjar test.apk app-release-unsigned.apk test.keystore

![在这里插入图片描述][70 10]  
![在这里插入图片描述][70 11]

注意：  
Keytool和jarsigner都是java下的工具，一个在bin文件目录下，一个在jre\\bin文件目录下，如果你安装了jdk，但是你输入keytool或者jarsigner都是不可运行的程序的话，

*  你可以直接拖入exe文件替换相应的名称文件，
 *  你也可以用管理员方式执行cmd然后输入keytool或者jarsigner，就会有相应的信息
 *  你也可以使用git打开也是可以执行的\*

### 2.5 如果你打包的是一个服务器的地址，那么你需要以下cordova文件： ###

2.5.1 将cordova文件中的config.xml的content修改成服务器地址  
![在这里插入图片描述][70 12]

2.5.2 修改下面这个文件 新增两段代码  
![在这里插入图片描述][70 13]  
![在这里插入图片描述][70 14]

//add 拦截webview的请求，实现加载本地js
    private static final String INJECTION_TOKEN = "http://injection/";

// add 拦截webview的请求，实现加载本地js
    
    if(url != null && url.contains(INJECTION_TOKEN)) {
            String assetPath = url.substring(url.indexOf(INJECTION_TOKEN) + INJECTION_TOKEN.length(), url.length());
            try {
                WebResourceResponse response = new WebResourceResponse(
                        "application/javascript",
                        "UTF8",
                        view.getContext().getAssets().open(assetPath)
                );
                return response;
            } catch (IOException e) {
                e.printStackTrace(); // Failed to load asset file
                return new WebResourceResponse("text/plain", "UTF-8", null);
            }
        }

2.5.3 修改你所在代码引入的cordova.js  
![修改你所在代码引入的cordova.js][cordova.js]

[70]: /images/20220506/027eb63360de4edf97b52c6e8dcf817d.png
[70 1]: /images/20220506/8e5556024e84443a81fb4b973963b434.png
[70 2]: /images/20220506/1ba69e3f00e04b28a99dbb55a0c61d8d.png
[70 3]: /images/20220506/f52b67b339f94f7a922081ee3bca4acb.png
[70 4]: /images/20220506/abcd79e9595040e3921ffbbcea2958c3.png
[70 5]: /images/20220506/e73383a08ef342b0abfc340f9af7d9ae.png
[70 6]: /images/20220506/28ab89afd5b84550afb7b28b07a1bfdf.png
[70 7]: /images/20220506/3752978a260a4ee8a1a4aae998452798.png
[70 8]: /images/20220506/5aa421949f7e414ba03a7098201decc5.png
[70 9]: /images/20220506/5377b6686ad84a13a24e0d2deb5b3c49.png
[70 10]: /images/20220506/50a1b25773244c128e6d4a42a3f2f2ec.png
[70 11]: /images/20220506/d625a464ca644926929afecef3f83ce8.png
[70 12]: /images/20220506/563a7d0129fd4c6287e9c2eb5f7f6df7.png
[70 13]: /images/20220506/344bfd03d1b34c37b2834a1d8df72542.png
[70 14]: /images/20220506/7d53db926af5459f9f3bf11e38f2c8d5.png
[cordova.js]: /images/20220506/3a8a6415810946a1a103794c64477580.png