Cordova LOGO
【牢騷幾句】
我們的項目中，我們需要把CordovaLib集成到項目中。由于時間緊，當時大致研究了一下各個文件之間的關系，然后按照這種規則，照貓畫虎寫了一下，完成了任務，當時看并沒有什么問題。但是隨著不斷增加集成的插件，再加上自己編寫的一些插件，發現沒有按照Cordova的編寫規范來做，在以下場景比較麻煩：
- 插件管理：增加、刪除、更新版本
- 想在一個Cordova工程中復用這些插件
全都要手工完成
最近看了下文檔，結合之前項目中的經歷，發現最簡單有效的辦法，其實還是按照Cordova-CLI的規則來玩，按照插件的規范編寫插件，然后通過Cordova-CLI來將插件加入項目，這樣的好處：
- 方便插件管理
- 方便在Cordova工程中進行插件復用
之前為了省事，雖然插件接口是按規則編寫的，但都是每個平臺直接編寫原生插件，并且單獨編寫cordova_plugins.js、config.xml、插件配置.js。這樣看似省事，實際上就出現了上述的維護等問題。
【正題開始】
下面說下在普通iOS工程中，引入CordovaLib的正確姿勢：
先發個總體步驟：
1. 創建原生工程；
2. 使用Cordova-CLI創建Cordova工程；
3. 從“Cordova工程”的“原生平臺工程”中，提取需要的文件，主要是以下幾部分：
config.xml
ios.json 或 android.json
platform_www 文件夾
插件的原生部分代碼
4. 加入到之前創建的原生工程中。
以下是詳細步驟說明
一、創建標準iOS工程，引入CordovaLib
使用Xcode創建標準iOS工程，通過Cocoapod引入CordovaLib，配置如下：
platform :ios, '8.0'
target 'TestCordovaLibIntegration' do
pod 'Cordova'
end
如果要使用CordovaLib的4.x版本，則只能支持iOS 8以上。
如果需要兼容iOS 7，可以使用CordovaLib的3.x版本，3.x系列中，最新是3.8，Podfile配置如下：
platform :ios, '7.0'
target 'TestCordovaLibIntegration' do
pod 'Cordova', '~> 3.8.0'
end
二、下載需要的插件，生成配置文件
以安裝以下兩個插件舉例：
cordova-plugin-console
cordova-plugin-inappbrowser
使用Cordova-CLI創建工程，添加平臺，引入插件
執行腳本如下：
# 創建工程
cordova create CordovaFileGenerator com.herbert.cordova.filegenerator CordovaFileGenerator
# 進入 Cordova 工程目錄
cd CordovaFileGenerator
# 添加 iOS 原生工程
cordova platform add ios
cordova platform add android
# 添加需要的插件
cordova plugin add cordova-plugin-console
cordova plugin add cordova-plugin-inappbrowser
三、將Cordova工程中需要的文件，提取到單獨的文件夾 CordovaFiles 中
提取相關文件
以下為執行的 shell 腳本：
cd CordovaFileGenerator
# 創建存放 Cordova 文件的目錄
mkdir -p ../CordovaFiles/iOS
mkdir -p ../CordovaFiles/Android
# >>>>>>>>>>>>>>>>>>>>>>>>>>>>> 復制 iOS 相關文件 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
# 復制 config.xml
cp -rf ./platforms/ios/CordovaFileGenerator/config.xml ../CordovaFiles/iOS/config.xml
# 復制 ios.json
cp -rf ./platforms/ios/ios.json ../CordovaFiles/iOS/ios.json
# 復制原生代碼文件
cp -rf ./platforms/ios/CordovaFileGenerator/Plugins/ ../CordovaFiles/iOS/Plugins
# 復制 Web 文件
cp -rf ./platforms/ios/platform_www/ ../CordovaFiles/iOS/www
# <<<<<<<<<<<<<<<<<<<<<<<<<<<<< 完成復制 iOS 相關文件 <<<<<<<<<<<<<<<<<<<<<<<<<<<<
# >>>>>>>>>>>>>>>>>>>>>>>>>>>>> 復制 Android 相關文件 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
# 復制 config.xml
cp -rf ./platforms/android/res/xml/config.xml ../CordovaFiles/Android/config.xml
# 復制 android.json
cp -rf ./platforms/android/android.json ../CordovaFiles/Android/android.json
# 復制原生代碼文件
mkdir -p ../CordovaFiles/Android/Plugins/org/apache/cordova/
cp -rf ./platforms/android/src/org/apache/cordova/ ../CordovaFiles/Android/Plugins/org/apache/cordova/
# 復制 Web 文件
cp -rf ./platforms/android/platform_www/ ../CordovaFiles/Android/www/
# <<<<<<<<<<<<<<<<<<<<<<<<<<<<< 完成復制 Android 相關文件 <<<<<<<<<<<<<<<<<<<<<<<<
得到如下文件列表：
./CordovaFiles/
|-Android/
| |-Plugins/
| | '-org/
| | '-apache/
| | '-cordova/
| | |-inappbrowser/
| | | |-InAppBrowser.java
| | | |-InAppBrowserDialog.java
| | | '-InAppChromeClient.java
| | '-whitelist/
| | '-WhitelistPlugin.java
| |-www/
| | |-cordova-js-src/
| | | |-android/
| | | | |-nativeapiprovider.js
| | | | '-promptbasednativeapi.js
| | | |-plugin/
| | | | '-android/
| | | | '-app.js
| | | |-exec.js
| | | '-platform.js
| | |-plugins/
| | | '-cordova-plugin-inappbrowser/
| | | '-www/
| | | '-inappbrowser.js
| | |-cordova.js
| | '-cordova_plugins.js
| |-android.json
| '-config.xml
'-iOS/
|-Plugins/
| |-cordova-plugin-console/
| | |-CDVLogger.h
| | '-CDVLogger.m
| |-cordova-plugin-inappbrowser/
| | |-CDVInAppBrowser.h
| | '-CDVInAppBrowser.m
| '-README
|-www/
| |-cordova-js-src/
| | |-exec.js
| | '-platform.js
| |-plugins/
| | |-cordova-plugin-console/
| | | '-www/
| | | |-console-via-logger.js
| | | '-logger.js
| | '-cordova-plugin-inappbrowser/
| | '-www/
| | '-inappbrowser.js
| |-cordova.js
| '-cordova_plugins.js
|-config.xml
'-ios.json
四、將提取出的文件加入到原生工程中
提取出的內容整體結構如下：
.
|-Plugins/ ......... 原生插件代碼————以源碼形式加入工程
|-www/ ............. Web 相關內容，以及插件代碼的 js 部分————以資源形式加入工程
|-config.xml ....... 工程配置————以源碼形式加入工程
'-ios.json ......... 引用插件的描述————以源碼形式加入工程
其中：
-
config.xml是CordovaLib直接讀取的，必須放在指定位置，iOS是直接的目錄下，Android應該是xml文件夾 -
Plugins/中的內容，是插件的原生代碼部分，需要參與編譯，必須作為源碼引入 -
ios.json本身沒有任何實際用途，但是里面記錄著引用的插件及配置，加入進來備用。后文中描述“遠程頁面”（如：www.baidu.com）無法加入<script src="cordova.js"></script>的情況，就需要手工加載插件，這時解析ios.json比較方便方便
五、補充說明
發現iOS版的CordovaLib 4.3.0之后，訪問遠程鏈接，會導致調用系統瀏覽器打開。
解決方法：
在config.xml中增加如下代碼：
<feature name="IntentAndNavigationFilter">
<param name="ios-package" value="CDVIntentAndNavigationFilter" />
<param name="onload" value="true" />
</feature>
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
注意：！！！
不要指定為 <allow-navigation href="*" />，這樣會導致拉起其他App時失敗。
（完）
